Marquee

Section overview

The Marquee section creates a horizontally scrolling display of content that repeats continuously, creating a dynamic and attention-grabbing element for your Shopify store.

Common use cases

• Highlighting promotional messages or announcements

• Showcasing brand values or keywords

• Displaying a series of product features or benefits

• Creating visual interest with alternating text and images

Usage tips

• Keep content concise for better readability as items scroll

• Use 3-5 blocks to ensure sufficient content for continuous scrolling

• Adjust animation speed based on content length and complexity

• For mobile responsiveness, consider using shorter text in heading blocks or setting visibility to desktop-only if content becomes too compressed on small screens

Section settings

Setting	Description
Top spacing	Controls the padding above the marquee (0-300px)
Bottom spacing	Controls the padding below the marquee (0-300px)
Color scheme	Determines the background color scheme of the section
Custom color	Sets a custom background color when "Custom" is selected as color scheme
Text color	Controls whether to use default text color or force light/dark text
Border color	Sets the color of section borders
Enable color fade	Enables the section to influence the site's background color when scrolled into view
Enable fade	Adds gradient fade effects at the left and right edges of the marquee
Border position	Controls where borders appear (top, bottom, both, or none)
Enable margin	Applies horizontal margin to the section
Use reverse animation	Changes the direction of the scrolling animation
Animation speed	Controls how quickly the marquee scrolls (10-200 seconds per cycle)
Visibility	Sets whether the section appears on all devices, mobile only, or desktop only

Block settings

Heading

Displays large, bold text within the marquee to emphasize important messages.

Setting	Description
Content	The heading text to display

Content

Displays formatted text content within the marquee for more detailed messaging.

Setting	Description
Content	Rich text content to display
X alignment	Controls text alignment (left, center, or right)

Button

Adds a clickable button within the marquee to direct visitors to other pages.

Setting	Description
Button label	Text to display on the button
URL	Where the button links to when clicked
Button color	Determines the style and color of the button

Image

Displays an image within the marquee to add visual elements between text content.

Setting	Description
Image	The image to display
Image height	Sets the height of the image in pixels (10-100px)