How to Add a Banner to Shopify (and Pick the Right Kind)

Which Banner Do You Need?

The word covers very different things in Shopify. Most are sections you add in the theme editor, but a cookie consent banner is set in Settings and a checkout banner comes from a separate Shopify app. Find your job below and follow the last column.

What Each Banner Is Called in Horizon and Dawn

Shopify says the sections and blocks you see depend on your theme and theme version, so the picker in your own editor is the final word. Hero and Image banner do the same job, but that match is our reading by function, not a statement from Shopify. If you are weighing a move between the two themes, our Horizon guide covers what carries over.

How Do You Add a Banner in the Theme Editor?

The steps are the same in Horizon and Dawn; only the section name changes.

1. Open the theme editor. In your Shopify admin, go to Online Store and click Edit theme on the theme you want to change. Customers only see your published theme, so a theme under Draft themes won't change the live store.

In Shopify adminOpen in your store

1. Online Store
2. Themes

Zoom

2. Pick the template. The editor opens on the home page. To put the banner somewhere else, click the Home page menu at the top and select the template.

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

3. Add the section. Under Template in the left panel, click Add section, then choose from the list or type in Search sections: Hero in Horizon, Image banner in Dawn.

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

4. Set the content. Select the new section and add your image. In Horizon's Hero, the image goes under Media 1, and the words and button are blocks inside the section, so expand it with its arrow. In other sections, edit the text and link the section offers.

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

5. Check the phone view. Click the phone icon in the top bar to preview the mobile layout, and look at how the image crops.

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

6. Save your changes. Use the save button your editor shows, then open the store to confirm the banner is there.

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

Shopify's help page says to click Save and, if you are editing a published theme, to click Publish. In our development store on November 5, 2026, the editor showed Save with an arrow beside it for the current theme (Dawn 15.0.0), and Publish and Save side by side for a draft (Horizon), so go by the button in your own top bar. With a change pending, the arrow beside Dawn's Save opened a Create rollout button; rollouts are covered in the scheduling section.

Each template can have up to 25 sections, so a long home page can run out of room. From the theme editor you can also ask Sidekick to add a section, but only one your theme already includes. For the rest of the editor, see our theme editor walkthrough.

Change the Image, Text or Link on a Banner

Select the section in the left panel and change what you need. Write the words in the editor rather than in the image file, because they then stay readable and editable. Shopify's guidance on the image itself is direct:

Shopify also advises simple images behind text, so that the overlay is easy to read. To edit the words, expand the section: in our store's Horizon on November 5, 2026, the default Hero held a Heading block and a Button block, with Add block above them.

To make the banner clickable, set a link. In the same Horizon, the Button block has Label and Link fields and an Open link in new tab toggle, and that link belongs to the button. The Hero section also has its own Section link group with a Link field. In the theme's code on main, that link is stretched across the whole section, so it is the one for a fully clickable banner.

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

We read the fields in the editor and the link in the code, and did not click either on a live storefront, so try the link in your store preview. Dawn's labels can differ, so go by your own section panel.

While you are there, add alt text to the image. Shopify notes that customers who use screen readers rely on it to communicate the content of images on your store.

Can You Show a Different Banner Image on Phones?

Shopify warns that wide images might be cropped on the left and right on tall screens such as phones. Whether a separate image can fix that depends on the section:

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

Where there is no second image, reduce the crop instead. A focal point keeps the important part of the image in frame: set it on the image, on supported themes only. In many of Shopify's free themes, the Height setting also has an Adapt to first image option that sizes the section to your image instead of cropping it.

The section, not your file, sets the shape of the image area, so there is no single correct upload size. Our answer on what size a Shopify banner image should be takes that question from there.

Where the Banner Appears: One Page, a Template or Every Page

On every page template, sections sit in three areas: Header, Template and Footer. Which area you edit decides who sees the banner, as the building blocks of Online Store 2.0 explain in more depth.

Three rules from Shopify's templates page catch people out:

• A template edit is shared. Your changes apply to every page that uses the template.
• A new template does nothing until assigned. You still need to assign it to the product, collection or page in your admin.
• Only your live theme counts. The template options you can assign come only from your current live theme.

Can a Banner Show on Every Page?

Shopify says your header and footer are shared across all of your store's pages, and that the Header area includes your header, announcement bar, and any apps or custom Liquid. Horizon's code agrees for the main banner: the Hero section is disabled for the header group.

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

With Hero blocked from the header, Horizon leaves three routes for an image on every page. Add a Hero to each template that needs it, add Hero under Footer, or write it yourself in Custom Liquid, which means code. In our store's Horizon, a Hero added under Footer would show on every page, but at the bottom, below each page's own content. Dawn's code on main blocks Image banner and Slideshow from both the header and footer groups, so check your own theme and version.

Slideshows and Moving Banners

Rotating images with a slideshow

Horizon lists Slideshow: Full frame, Slideshow: Inset and Layered slideshow, and Dawn has Slideshow. The same text rule applies to each slide: keep words out of the image and use a simple background. If your theme's Height setting has Adapt to first image, the section follows the first slide, so make the slides the same shape.

Moving text with Marquee

Searching marquee is quicker than browsing, because the two results sit in different categories:

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

In Dawn's code on main we found no moving, marquee or ticker section, so a store on that code may need an app or custom code for this.

Can You Schedule a Sale Banner?

Scheduling sits one level up: Rollouts let you save theme changes and schedule them to go live at a specific date and time. For a sale, the type to use is an Event, which requires an end date. Shopify's changelog describes the result:

Rollouts are available on the Basic plan or higher, and you can't apply them to vintage themes or change Liquid templates as part of one. Customizations you make in the theme editor apply only to that rollout, which is what keeps the sale banner out of your live theme until the date. Shopify documents this for theme changes in general; we did not run one on a banner section.

For how the rollout types differ and what else one can carry, see what a rollout actually is.

Why Isn't Your Banner Showing?

You added the banner and the editor shows it, but the store doesn't. Or it appears on one product and not on another. The table runs from what you see to where to look.

In Shopify adminOpen in your store

1. Online Store
2. Edit theme

Zoom

Will a Large Banner Slow Your Store?

The file is the part you control. Shopify optimizes images automatically through its image CDN, and advises JPG for photos, PNG for graphics with transparency, and resizing images to match their display size. For the rest of that picture, see what Shopify handles and what you control.

Do You Need an App for a Banner?

Look through Add section in your own theme first, because the list depends on the theme. If the feature isn't there, these are two listings we found on November 5, 2026. It is not an exhaustive list, the words are the developers' own, and we did not install either:

• Fab Marquee Scrolling Text. Its listing says: "Add a scrolling announcement bar with marquee effect to attract visitors attention to the promo message, discount or announcement on your website."
• Countdown Timer & Banner Bar. Its listing says: "Create countdown timers, announcement bars and sale banners."

Banners That Aren't Theme Sections

Can You Add a Banner to Checkout?

Checkout Blocks is Shopify's own app. Its static content block adds text or a banner without conditional display rules. The block is available on the Basic plan or higher and goes only on the Thank you and Order status pages. A block with the banner content type doesn't support customizing the font size, alignment or appearance.

Checkout Blocks' other features, beyond the dynamic and static content blocks, are available only to Shopify Plus. Apps that customize the information, shipping and payment pages, including checkouts from draft orders, are available only to Shopify Plus. These limits come from Shopify's pages on Checkout Blocks and checkout apps.

A background image is not the way round these limits. As of February 5, 2026, you can no longer add a background image to the checkout Header or the Main content area; our answer on checkout background images covers where an image still goes.

For what customization each plan unlocks in checkout overall, see our checkout extensibility guide.

The cookie consent banner

This one isn't a theme section at all. You change it under Settings > Customer privacy > Cookie banner, where you can edit its text, colors and position.

The Bottom Line

Frequently Asked Questions