Marquezy — Announcement Bar and Marquee Block for WordPress

Marquezy — Announcement Bar and Marquee Block for WordPress

The problem

Important information or an announcement has to be seen right away: a discount, delivery terms, new opening hours, planned maintenance. It should go up quickly, appear only on the pages that need it, and not break the layout.

Usually this means either editing the header template or installing a plugin that injects the bar with a script after the page has loaded. In the first case every text change is work inside the theme. In the second the page jumps when the bar appears at the top and pushes all the content down.

The solution: an announcement bar under the header

Marquezy adds an announcement bar right below the header. The text, the look and the pages where it appears are all set in one place, Settings → Marquezy, with a live preview and no theme edits.

In block themes the bar is added to the markup on the server, so the page loads with it already in place and nothing shifts. In classic themes the plugin finds the header on its own, and for an unusual theme the position can be set with a CSS selector.

Where it shows

On the entire site, only on selected pages, everywhere except them, or only where you place the block. Conditions can be combined: specific pages and posts, post types, categories, tags and other terms, plus the front page, blog, archives, search and 404.

For example, a delivery notice can appear only in the shop, and a maintenance warning everywhere except the contact page.

How it looks

Phrases are added as a numbered list, each in its own field with bold, italic and links. Links are picked by searching the site’s pages, with no URLs to copy.

The bar scrolls with the content, stays on screen, or behaves “smart”: it hides and returns together with the header as you scroll. A closed announcement stays closed until the text changes, so a new announcement is shown again. On mobile the bar can use its own font size or be hidden, with a custom breakpoint.

The Marquee block for Gutenberg

Besides the announcement bar, there is a marquee block for scrolling text inside a page. One to three rows: straight, tilted up to 10°, or two crossed rows with an adjustable crossing point. The direction is set for each row separately.

Every phrase is a regular paragraph, so colours, font size and spacing come from the editor’s own controls, like any other block. The animation runs right in the editor. The block can also show the global announcement bar anywhere on a page.

Shortcodes

For any page builder and the Classic Editor there is a shortcode builder with the same options as the block and a live preview. The shortcode works anywhere shortcodes are supported. Rows added to the page later, for example in popups or builder previews, start automatically.

Under the hood

The animation is CSS, with no jQuery or third-party libraries, just a small script. The loop is seamless: no jumps or rewinds where it repeats. When a row is out of view, the animation stops and costs the browser nothing.

The marquee pauses on hover and keyboard focus and respects the system “reduce motion” setting. An optional pause button covers WCAG 2.2.2, and the duplicated phrases are hidden from screen readers.

With WPML, Polylang and TranslatePress, phrases are stored per language. If a language has no phrases, the first language that has them is used. On uninstall the plugin removes its settings from the database, while blocks and shortcodes in your posts stay as they are.

Requires WordPress 6.3 or later.