Scrolling banner

Display large, high-impact images with text and buttons in a horizontal scrolling format

Highlight important campaigns, collections, or brand messages through a horizontally scrollable visual banner. Perfect for storytelling, promotions, or setting the visual tone of your store.

How to add a Scrolling banner section to your Shopify store

Steps:

1. In the theme editor (Customize),> click Add section.

2. Select Scrolling banner.

3. Make necessary changes.

4. Save the settings.

How to edit a Scrolling banner section

Section settings

• Container:

  • Full width: Spans edge to edge across the browser window.

  • Fixed width: Keeps content within your site's content width for a more boxed layout.

Go to Theme settings > Layout to set your Page width.

• Slide height: Choose how tall your banner appears.

  • Adapt to first image

  • Small

  • Medium

  • Large

• Mobile layout: Set how the content appears on mobile view. This setting applies to all image slides.

• Animations:

  • Enable zoom: Apply a zoom-in effect on the background image.

  

  • Enable parallax: Add a layered scrolling effect between the background and content.

Block settings

Each Image slide is its own visual block. You can add multiple slides to scroll horizontally.

• Image settings:

  • Desktop image: Upload a high-res image (1920x900 px recommended). This is your main visual.

  • Mobile image: Optional, mobile-optimized image (600x480 px recommended). 🌟 Tip: Use a version that keeps text-free areas clear so overlayed text remains readable.

  • Image overlay opacity: Use this slider (0–100%) to darken the image so your text stands out.

• Content settings: Add the image slide content and a CTA button that links to a desired page.

• Product: Optional. You can associate a featured product with the slide.

  • Select a product to display at the bottom of the image.

  • Select a color scheme for that product card.

  👀 Learn how to set up Colors

FAQs

Can I add video backgrounds to this section?

Not supported natively in this section.

For video, consider using the Video hero or Slideshow section.

Can I link each slide to a different collection?

Yes. Each button can link to its own page, collection, product, or external URL.

---

Install XFlow Back In Stock Automation FREE