Marquee

Add scrolling text to your page.

View demo

Updated

Usage

The Marquee block adds a band of text that scrolls sideways across the page, like a news ticker. Use it for announcements, sales, event dates, or a short message you want people to notice. The text repeats so the loop never runs out.

Set the message, scroll speed, padding, look, and heading level from the sidebar.

Text

Type your message in the Text field (sidebar or inline). The block repeats it to fill the band.

  • End the message with a separator such as • or | so the repeats read clearly
  • If you see gaps between loops, make the message longer. The default already ends with a bullet (I am your marquee • )

Screen readers and search engines get the message once, not every repeat.

Options

  • Duration factor — how fast the text moves. Higher values scroll slower. Loop time also adjusts to the length of your message.
  • Padding — space above and below the text
  • Style — how the text looks, using your Customizer type styles (h1–h6, paragraph, bold)
  • Tag — the heading level in the page outline (h1–h6 or paragraph). Doesn't change the look.

Style and Tag are separate. Match them for predictable results, or mix them on purpose, for example a large look on a lower heading level.

Block width

Marquee supports Wide and Full alignment from the block toolbar (default is wide). Full-width marquees run edge to edge across the screen.

Tips

  • Keep messages short — scrolling works best for punchy phrases, not paragraphs.
  • Check the speed on a phone; what feels slow on desktop may read fine on a small screen.
  • Pair with a Hero or Logos band above or below for event or sponsor announcements.

Screenshots

Front-end

  • Full-width marquee between a hero photo and a two-column text section on the home page.

Editor

  • Text and Duration factor settings — duplicated message string and scroll speed in the sidebar.
  • Style and Tag presets — visual typography vs semantic heading level for the scrolling line.

Settings

Settings

Text setting in the block editor sidebar
Text

Your message, repeated automatically to fill the band. End it with a separator such as • or | so the repeats read clearly.

Duration factor setting in the block editor sidebar
Duration factor

Higher values scroll slower. Loop time also adjusts to the length of your text.

Padding setting in the block editor sidebar
Padding

Space above and below the scrolling text.

Style setting in the block editor sidebar
Style

Changes how the text looks. Use **Tag** to set its heading level.

  • <h1>
  • <h2>
  • <h3>default
  • <h4>
  • <h5>
  • <h6>
  • <p>
  • <strong>
Tag setting in the block editor sidebar
Tag

Sets the heading level in the page outline, or a plain paragraph. It doesn't change the look; use **Style** for that.

  • <h1>
  • <h2>
  • <h3>default
  • <h4>
  • <h5>
  • <h6>
  • <p>