How to Add a Rotating Image Banner to Any Shopify Theme

Brandon Landgraff


Rotating image banners are one of the most common design elements you’ll see on Shopify stores. They’re a simple but powerful way to:

  • Highlight multiple campaigns or seasonal promotions
  • Showcase brand photography in a clean, professional way
  • Make the most of limited homepage real estate without cluttering your layout


Most Shopify themes (like Dawn or Horizon) let you add a full width image banner but they don’t always support rotating multiple images out of the box. That’s where Flexi comes in.


In this guide, I’ll walk you through how to set up a rotating banner in any Shopify theme, step by step.

 

Why Use a Rotating Image Banner?

If your store runs different promotions throughout the year, you don’t want to constantly swap out your main hero banner. A rotating banner lets you:

  • Cycle through multiple offers automatically
  • Keep your site looking fresh without constant manual changes
  • Add a polished, professional touch to your storefront


Step 1: Install Flexi Theme Sections

Full transparency: this rotating banner section comes from Flexi Theme Sections — my professional library of sections built for freelancers, agencies, and in-house teams.

  • The library costs $35/month for full access
  • Even if you only subscribe for a single month, you’ll own the section forever
  • Considering I used to charge $1,000 per custom section, it’s a steal


Once installed, you’ll be able to add pro-quality sections like this to any Shopify theme in just a few clicks.

 

Step 2: Add the Rotating Image Banner

Inside the Flexi app, choose the Rotating Image Banner section and install it onto your theme.


Then, head into the Shopify theme editor, click Add section, and search for Full Width Image.

 

Step 3: Add Your Images & Content

With the section in place, it’s time to add content:

  1. Select the Rotating Images layout
  2. Add image blocks and upload both desktop and mobile versions for best results
  3. Adjust the banner height and sizing to fit your design
  4. Add overlay text, call-to-action buttons, or leave it clean for photography-first stores


Pro tip: keep all your images the same aspect ratio. This prevents the layout from “jumping” when the banner rotates.


Step 4: Preview & Publish

Click save, preview your site, and you’ll see your rotating banner live. Now, instead of a single static hero, you can rotate through multiple campaigns seamlessly.

Back to Resources