Scrolling text section

The Scrolling text section in Seventh shows a moving band of text, images, icons, buttons or countdowns, for announcements and logo lists.

Applies to: Seventh 4.0.0 and later. Added in: Seventh 1.0.0. Last checked: 2026-10-12 against Seventh 4.0.0.

The Scrolling text section shows a band of text, images, icons, buttons or countdowns that moves sideways across the screen in a continuous loop, on any page.

Where to find it: select Add section in the theme editor, then choose Scrolling text or Logo list: scrolling.

What it shows

A row of blocks that scroll together.
Seventh repeats the row as often as needed to fill the screen width, so the loop never shows a gap.

Two presets use this section:

Scrolling text starts with two Text blocks and one rounded Image.
Logo list: scrolling starts with six Image blocks for brand logos. See Logo list section.

To show a scrolling band at the very top of every page, use the Scrolling text block of the Announcement bars section instead. See Announcement bars section.

Scrolling

Scroll direction sets where the band moves: Left moves the content toward the left edge, Right toward the right edge.
Scroll speed is the distance the band moves per second, in pixels. A higher value is faster: 100 (the default) moves it 100 px per second on desktop.
On screens 768 px wide or narrower, Seventh slows the band to two thirds of that speed, so it stays readable.
Pause on mouseover stops the band while the pointer is over it.
Horizontal space sets the space between the blocks in the band.

Older Seventh docs described Scroll speed in seconds, with lower values being faster. That is not how Seventh 4.0.0 works: a higher value is faster.

Typography

Text size sets the size of the text in the band, as one of the theme's heading sizes. Images and logos in the band scale with it.

Section design

The section uses the standard Section design settings, listed in General section styling.

Blocks

Text: a short line of text, set in the headings font by default.
Image: a small image or logo that scales with the text size.
Countdown: a timer to a set date and hour.
Button: a link styled as a button. See Button block.
Icon: a single icon. See Icon block.

The Image block is sized by the section's Text size, not by its own setting. Wide images (logos) are 1.5 times the text height, square images 1 time and tall images 0.75 times, with a minimum of 30 to 50 px.

The Countdown block counts down to the end date and hour you set, in the timezone you select. For how countdowns behave after the end date, see Countdown block.

How do I make all logos the same height?

Use logo files with the same shape. Seventh sizes each image by its shape (wide, square or tall), so logos of one shape get the same height. Crop all logos to the same aspect ratio, for example 3:1, before you upload them. Then set Text size to make the whole band larger or smaller.

Why does the band not stop when I hover over it?

Because Pause on mouseover is off. Turn it on to stop the band while the pointer is over it. Turn on Gradually pause on hover to slow it to a stop over 1 second instead of stopping at once.

All Scrolling text settings

Every setting on this page, one list per section or block, with its type and default.

Accepts these blocks: Button, Image, Text, Countdown and Icon.

Scroll direction (dropdown, default: Left): Sets the direction the band moves: Left moves the content toward the left edge, Right toward the right edge. Options: Right, Left.

Scroll speed (slider 20 to 300, step 10, default: 100): Sets how many pixels the band moves per second, from 20 to 300. A higher value is faster. On screens 768 px wide or narrower, the band moves at two thirds of this speed.

Pause on mouseover (checkbox, default: on): Stops the band while the pointer is over it.

Gradually pause on hover (checkbox, default: off): Slows the band to a stop over 1 second, and back up to speed, instead of stopping and starting at once. Shown only when Pause on mouseover is on and Is scrolling banner is on.

Horizontal space (dropdown, default: Medium): Sets the space between the blocks in the band. Options: Small, Medium, Large, XLarge.