Brickspace Lab
Contact usContact ShopifyTry a theme
Keystone
Keystone
  • Keystone documentation
  • Getting started
    • Theme basics
    • Theme settings
      • Colors
      • Typography
      • Borders
      • Prices
      • Quick add
  • Guides
    • Products
      • Product badges
      • Product subtitles
      • Custom content for tables
      • Replace "Add to cart"
      • Disable quick add
    • Wholesale
      • Wholesale basics
      • Account restrictions
    • Color and option swatches
    • Device specific visibility
    • Discount popups
  • Templates
    • Collection template
    • Product template
    • Blog template
    • Article template
  • Sections
    • Global Sections
      • Header
      • Footer
      • Navigation links
      • Announcement
      • Cart drawer
      • Account drawer
      • Search drawer
      • Menu drawer
    • Media & Promotional
      • Slideshow
      • Video
      • Split banner
      • Marquee
      • Image hotspot
      • Countdown
      • Discount
      • Banner
      • Slider
      • Testimonial slider
      • Search banner
    • Product & Collection Displays
      • Product grid
      • Product slider
      • Product table
      • Product comparison
      • Recently viewed
      • Collection list grid
      • Collection list slider
      • Featured product
      • Comparison table
    • Content & Marketing
      • Rich text
      • Blog posts grid
      • Testimonial grid
      • Logo list
      • Icon grid
      • Collapsible content
      • Tabs
      • Collage
    • Utility & Custom
      • Custom liquid
      • Tool tip
      • Store locater
    • Forms & CTAs
      • Email sign-up
      • Sign-up form
      • Contact form
  • General
    • Changelog
      • v1.3.0
      • v1.2.0
      • v1.1.0
      • v1.0.1
      • v1.0.0
    • Known issues and troubleshooting
    • Cloning a demo theme
Powered by GitBook
On this page
  • Section overview
  • Section settings
  • Block settings

Was this helpful?

Edit on GitHub
  1. Sections
  2. Media & Promotional

Marquee

Section overview

The Marquee section displays content in a horizontally scrolling animation, creating an eye-catching way to highlight information, promotions, or brand messaging.

Common use cases

  • Displaying announcements or promotional messaging

  • Showcasing brand values or key product features

  • Creating visual interest with alternating text and images

  • Highlighting time-sensitive information like sales or events

Usage tips

  • Keep content concise and scannable for easy reading while in motion

  • Use consistent block types for a cohesive look (all headings or alternating heading/image)

  • Adjust animation speed based on content length and complexity

  • For mobile, consider using fewer or simpler blocks as the smaller screen may make text harder to read

Section settings

Setting
Description

Top spacing

Controls the space above the section (0-300px)

Bottom spacing

Controls the space below the section (0-300px)

Color scheme

Determines the background and text color combination

Border color

Sets the color of the section border

Border position

Controls where borders appear (top, bottom, both, or none)

Enable margin

Adds horizontal margin to the section

Use reverse animation

Changes the direction of the scrolling animation

Animation speed

Controls how fast the content scrolls (10-200s)

Visibility

Controls on which devices the section appears

Block settings

Heading

The Heading block displays large, bold text in the marquee.

Setting
Description

Content

The text to display as the heading

Content

The Content block displays rich text content within the marquee.

Setting
Description

Content

The rich text content to display

X alignment

Controls horizontal text alignment (left, center, right)

Button

The Button block adds a clickable button to the marquee.

Setting
Description

Button label

The text to display on the button

URL

The destination page when the button is clicked

Button color

Controls the button style and color scheme

Image

The Image block displays an image within the marquee.

Setting
Description

Image

The image to display

Image height

Controls the height of the image (10-100px)

Last updated 25 days ago

Was this helpful?