# 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) |