> ## Documentation Index
> Fetch the complete documentation index at: https://docs.digifist.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Marquees

> Continuously scrolling horizontal ticker displaying text items with icons

The Marquees section creates a continuously scrolling horizontal ticker animation displaying text items with optional icons. Perfect for highlighting key messages, store features, promotional offers, or trust indicators in an eye-catching, dynamic format. This animated section draws attention without being obtrusive and works particularly well for highlighting multiple short messages or benefits in limited vertical space.

## What this section controls

This section controls scrolling ticker displays with the following capabilities:

* Continuously scrolling horizontal animation
* Multiple text items with optional icons
* Adjustable animation speed (duration rate 1-10)
* Font size control (1-4) for text items
* Icon size control (1-4) for icon scaling
* Animation enable/disable toggle
* Three width options (Page width, Fluid, Full width)
* Color scheme, spacing, and border controls

## Section settings

<AccordionGroup>
  <Accordion title="Animation">
    **Enable animation** — Toggle the scrolling animation on or off (enabled by default).

    When enabled, items scroll continuously. When disabled, items display statically.

    **Marquee duration rate** — Control the animation speed.

    Range: 1-10 (default: 5)

    <Note>
      Higher numbers result in slower animation. Lower numbers create faster scrolling.
    </Note>
  </Accordion>

  <Accordion title="Element sizing">
    **Marquee font size** — Control the text size of marquee items.

    Range: 1-4 (default: 1)

    Larger values increase text size for more prominent display.

    **Marquee icon size** — Control the size of icons displayed with items.

    Range: 1-4 (default: 1)

    Adjust to balance icon and text proportions.
  </Accordion>

  <Accordion title="Section width">
    Choose the container width:

    * **Page width** (default) — Standard container width
    * **Fluid** — Wider, edge-to-edge within padding
    * **Full width** — Complete edge-to-edge layout

    <Tip>
      Use full width for maximum visual impact and to ensure smooth scrolling across the entire viewport.
    </Tip>
  </Accordion>

  <Accordion title="Color scheme">
    Select the background and text color scheme for the section (default: scheme-1).
  </Accordion>

  <Accordion title="Spacing">
    Control vertical spacing above and below the section with options from None to XL (0, S, M, L, XL). Default is M for both top and bottom.
  </Accordion>

  <Accordion title="Section border">
    Add decorative borders:

    * **None** (default) — No borders
    * **Top** — Border above the section
    * **Bottom** — Border below the section
    * **Both** — Borders above and below
  </Accordion>
</AccordionGroup>

## Block: Item

Create individual scrolling marquee items with text and optional icons. Unlimited blocks allowed.

<AccordionGroup>
  <Accordion title="Icon">
    Upload a custom icon image to display before the text. This is optional—items can have text only.

    <Tip>
      Use simple, recognizable icons (check marks, stars, shipping trucks, etc.) that complement your messaging. Icons help items stand out in the scrolling animation.
    </Tip>
  </Accordion>

  <Accordion title="Title">
    Enter the text content for this marquee item (e.g., "Free Shipping Over \$50", "Secure Checkout", "30-Day Returns").

    Keep text concise—typically 2-6 words work best for scannability in a moving ticker.
  </Accordion>

  <Accordion title="Link">
    Optionally add a URL to make the entire item clickable. Useful for linking to policy pages, collections, or promotional landing pages.
  </Accordion>
</AccordionGroup>

## Default configuration

The section preset includes four example items:

1. "Store Specification 1"
2. "Store Specification 2"
3. "Store Specification 3"
4. "Store Specification 4"

Replace these with your actual store features, promotions, or trust indicators.

## Best practices

<CardGroup cols={2}>
  <Card title="Concise messaging" icon="align-left">
    Keep item text brief (2-6 words) for easy reading in the scrolling animation. Longer text becomes difficult to scan.
  </Card>

  <Card title="Consistent icons" icon="icons">
    Use a consistent icon style across all items for a cohesive visual appearance. Match icon style to your brand aesthetic.
  </Card>

  <Card title="Speed balance" icon="gauge">
    Set duration rate carefully—too fast creates stress, too slow may be ignored. Test different speeds to find the sweet spot (4-6 typically works well).
  </Card>

  <Card title="Item count" icon="hashtag">
    Add 4-8 items for optimal visual effect. Too few items create obvious repetition; too many can overwhelm.
  </Card>

  <Card title="Full width impact" icon="arrows-left-right">
    Use full width section setting for maximum visual impact and seamless edge-to-edge scrolling.
  </Card>

  <Card title="Strategic placement" icon="map-pin">
    Place marquees strategically—below header for announcements, above footer for trust signals, or between sections for visual breaks.
  </Card>

  <Card title="Pause consideration" icon="circle-pause">
    The animation typically pauses on hover (theme setting). This allows users to read and click items without chasing them.
  </Card>

  <Card title="Mobile testing" icon="mobile">
    Preview on mobile devices where font and icon sizes may need adjustment for smaller screens.
  </Card>
</CardGroup>

## Common use cases

* **Shipping benefits** — "Free Shipping Over \$50" / "Express Delivery Available" / "Worldwide Shipping"
* **Trust indicators** — "Secure Checkout" / "SSL Encrypted" / "Trusted Since 2020"
* **Return policies** — "30-Day Returns" / "Free Returns" / "Easy Exchanges"
* **Store features** — "Handmade Products" / "Eco-Friendly" / "Small Batch"
* **Promotional messages** — "New Arrivals Weekly" / "Limited Editions" / "Member Discounts"
* **Service highlights** — "Expert Support" / "Gift Wrapping" / "Personal Shopper"
* **Social proof** — "10K+ Happy Customers" / "5-Star Rated" / "Award Winning"
* **Announcements** — "Spring Sale Now On" / "Holiday Hours" / "New Location"

## Accessibility considerations

* Ensure sufficient color contrast between text and background for readability
* Avoid setting animation speed too fast, which can cause motion sickness for some users
* The pause-on-hover functionality (if enabled globally) helps users who need more time to read
* Keep critical information in non-animated sections as well, as some users may overlook scrolling content

## Related sections

<CardGroup cols={2}>
  <Card title="Trust indicators" icon="shield-check" href="/themes/sahara/sections/trust-indicators">
    Static trust badges and indicators section
  </Card>

  <Card title="Announcement bar" icon="bullhorn" href="/themes/sahara/sections/announcement-bar">
    Top-of-page announcement banner
  </Card>
</CardGroup>