BT Ticker Tape Documentation

Add a smooth, infinitely scrolling ticker tape to your WordPress site. Pure CSS animation — no JavaScript required.

Overview

BT Ticker Tape adds a horizontal scrolling ticker bar to your WordPress site. Use it for announcements, promotions, breaking news, brand messaging, or any content you want visitors to notice.

The entire animation is powered by pure CSS — no JavaScript is loaded on the frontend. This means zero impact on your page load performance and full compatibility with caching plugins.

The plugin adds a single settings page under Settings › Ticker Tape where you manage your ticker items and customize every aspect of the ticker's appearance and behavior.

Installation

Download the .zip file from the Boulley Technology website. In your WordPress admin, go to Plugins › Add New › Upload Plugin, select the ZIP file, and click Install Now.

Once installed, click Activate. The settings page is available immediately at Settings › Ticker Tape.

BT Ticker Tape requires WordPress 5.0 or higher and PHP 7.4+.

Note: The ticker will not appear on the frontend until you add at least one ticker item and save the settings.

Ticker Items

Ticker items are the individual messages that scroll across the screen. Each item has two fields:

Icon — An optional emoji or Unicode character displayed before the text (e.g. 🚀, ⚡, 🎁). Leave blank for text-only items.
Text — The message content. Keep items short and punchy for best readability at scrolling speed.

Use the Add Item button to add new items. Click the remove button on any item to delete it. Items scroll in the order they appear in the list.

Tip: There is no limit to the number of items. However, 3 to 8 items generally works best — enough variety to keep the ticker interesting without overwhelming readers.

Separator

The separator is the character displayed between each ticker item as they scroll. It visually divides one message from the next.

Separator Character — Enter any character or Unicode symbol. Common choices include ✶ (six-pointed star), • (bullet), | (pipe), ❖ (diamond), or ~ (tilde).

The separator inherits the ticker's text color. Leave the field empty if you prefer no visible separator between items.

Appearance

Customize how the ticker bar looks to match your site's design.

Background Color — The primary background color of the ticker bar. Use the color picker or enter a hex value.
Gradient Color (optional) — Set a second color to create a left-to-right gradient background. Leave empty for a solid color.
Text Color — The color of the ticker item text and separator. Default is white (#ffffff).
Font Size (px) — Text size in pixels. Default is 14px. Increase for more prominent messaging.
Padding (px) — Vertical padding inside the ticker bar. Default is 10px. Increase for a taller bar.

Tip: For a branded look, set the background to your primary brand color and the gradient to a slightly darker or lighter shade of the same hue.

Position & Behavior

Control where the ticker appears and how it behaves.

Position

Top of Page — The ticker appears at the very top of the page, above everything including the header.
Below Header — The ticker appears directly after the site header/navigation.
Bottom of Page — The ticker is fixed to the bottom of the viewport.

Sticky

When enabled, the ticker sticks to the top or bottom of the viewport as the user scrolls. This keeps your message visible at all times. Works with both top and bottom positions.

Pause on Hover

When enabled, the scrolling animation pauses when a visitor hovers their cursor over the ticker bar. This lets users read the current item at their own pace. The animation resumes when the cursor leaves the ticker.

Hide on Mobile

When enabled, the ticker is hidden on screens narrower than 768px. Use this to keep mobile layouts clean if the ticker is not essential on small screens.

Note: The "Below Header" position uses the wp_body_open hook. If your theme does not support this hook (introduced in WordPress 5.2), the ticker will fall back to the top-of-page position.

Speed

The Scroll Speed setting controls how long it takes for the full ticker content to complete one loop, measured in seconds.

Lower values — Faster scrolling (e.g. 10s for a quick-moving ticker)
Higher values — Slower scrolling (e.g. 40s for a relaxed, easy-to-read pace)

The default is 20 seconds. The ideal speed depends on how many items you have and how long each message is. Test a few values on the frontend to find the right pace.

Heads up: Very fast speeds (under 8 seconds) can make text difficult to read and may feel distracting. Very slow speeds (over 60 seconds) can make the ticker appear frozen.

FAQ

Does it slow my site down?

No. BT Ticker Tape uses pure CSS animation with no JavaScript on the frontend. The only output is a small block of inline CSS and HTML. It has zero impact on page load time and scores perfectly on Core Web Vitals.

Can I use HTML in ticker items?

No. Ticker item text is output as plain text for security reasons. HTML tags will be stripped. You can use emoji and Unicode characters in the icon field for visual flair.

Does it work with caching plugins?

Yes. Since the ticker is rendered as static HTML and CSS with no JavaScript or AJAX calls, it works perfectly with all caching plugins including WP Super Cache, W3 Total Cache, WP Rocket, and LiteSpeed Cache. After changing settings, clear your cache to see updates.

How many items can I add?

There is no hard limit. You can add as many items as you need. For the best user experience, 3 to 8 items is the sweet spot — enough to deliver variety without making the ticker too long to follow.