Scrolling Strip
On this page 8
A bold, continuously moving band of words or logos that runs across the full width of the screen - ideal for slogans, promotions, or brand names. Choose between oversized Large Text or colored Crossed Ribbons that tilt across each other.
Layout
- Strip Layout - the overall look: Layout 01 — Large Text (a single row of big, eye-catching text) or Layout 02 — Crossed Ribbons (the text runs along a tilted, colored ribbon, optionally crossed by a second faded ribbon behind it). Each layout has its own group of options below.
Large Text Options
Only relevant when Strip Layout is “Layout 01 — Large Text”.
- Separator - a small mark placed between items: Hollow Circle, Filled Dot, or None. It uses the same color as the text.
- Item Gap (Desktop) - the space between items (and between each item and its separator), in pixels, on tablets and larger screens.
- Item Gap (Mobile) - the same space on phones.
- Vertical Padding (Desktop) - the empty space above and below the strip, in pixels, on tablets and larger screens.
- Vertical Padding (Mobile) - the same space on phones.
- Speed - how fast the strip moves. Higher numbers move faster. The strip moves at a gentler pace on phones.
Ribbon Options
Only relevant when Strip Layout is “Layout 02 — Crossed Ribbons”.
- Ribbon Color - the fill color of the ribbons.
- Tilt Angle - how steeply the ribbons are angled, from 0 (flat) to 5. The front and back ribbons tilt in opposite directions to form a cross. The tilt is mirrored on the Arabic version of your store.
- Ribbon Padding (Desktop) - the space above and below the text inside the ribbon, which makes the ribbon thicker or thinner, on tablets and larger screens.
- Ribbon Padding (Mobile) - the same space on phones.
- Show Crossing Back Ribbon - when on, a second ribbon appears behind the main one, tilted the other way and moving in the opposite direction.
- Back Ribbon Opacity - how visible the back ribbon is, from 0% (invisible) to 100% (fully solid). Only used when the back ribbon is shown.
- Grayscale Back Ribbon - when on, the back ribbon is shown in black and white (including its color and any logos), so it stays in the background behind the front ribbon.
- Separator - a small mark placed between items: Hollow Circle, Filled Dot, or None. It uses the same color as the text.
- Item Gap (Desktop) - the space between items (and between each item and its separator), in pixels, on tablets and larger screens.
- Item Gap (Mobile) - the same space on phones.
- Vertical Padding (Desktop) - the empty space above and below the ribbons, in pixels, on tablets and larger screens.
- Vertical Padding (Mobile) - the same space on phones.
- Speed - how fast the ribbons move. Higher numbers move faster. The ribbons move at a gentler pace on phones.
Text
- Font Size (Desktop) - the size of the text on large screens, in pixels. On tablets and smaller laptops the text is shown at about three-quarters of this size, but never smaller than the mobile size.
- Font Size (Mobile) - the size of the text on phones.
- Font Weight - how bold the text appears, from Regular to Black.
- Text Style - how the letters are drawn: Stencil (outlined letters filled with the background color - or with the ribbon color in the Crossed Ribbons layout), Outline (outlined letters with a see-through middle), or Solid (fully filled letters).
- Outline Width - the thickness of the letter outline, in pixels. Only used when Text Style is Stencil or Outline.
- Text Color - the color of the text, its outline, and the separators. If left empty, the theme’s normal text color is used.
Logos & Images
- Logo Height (Desktop) - how tall logo and image items appear, in pixels, on tablets and larger screens. The width adjusts automatically to keep each logo’s shape.
- Logo Height (Mobile) - how tall logo and image items appear on phones.
Motion
- Scroll Direction - whether the strip moves To the left or To the right. In the Crossed Ribbons layout, the back ribbon always moves the opposite way.
- Pause on Hover - when on, the strip stops moving while a visitor’s cursor is over it.
- Drift With Page Scroll - when on, the strip also slides slightly sideways as visitors scroll up or down the page, adding an extra sense of movement. This effect only appears in browsers that support it.
Background
- Section Background Color - the background color of the whole section. If left empty, the page’s normal background color is used.
Items (Text or Logo)
Each entry in this list is one item in the strip. The items repeat automatically so the strip always looks full and loops smoothly. Entries with neither text nor a logo are skipped; while there are no items at all, a short reminder to add texts or logos is shown instead.
- Text (or logo alt text) - the words shown in the strip. If this item also has a logo, the text isn’t shown; it’s used as a short description of the logo for accessibility and search engines instead.
- Logo / Image — replaces the text - a logo or image to show instead of the text. Its size is set by Logo Height.
- Link URL - a web address that opens when a visitor clicks this item. Leave it empty if the item shouldn’t be clickable.