Sticky Add to Cart on Shopify Mobile: When It Helps and How to Add It

Illustration: a storefront with a striped awning next to a phone showing a product page with a slim Add to cart bar stuck to the bottom, a scroll arrow, and a dashed line to a shopping bag marked +1 item.

On a phone, the Add to cart button is usually the first thing a shopper scrolls past. They see the photos, the price and the button, then keep going: the description, the size guide, the reviews. By the time they've decided to buy, the button is several screens up.

A sticky add-to-cart bar fixes that by bringing a slim copy of the button back once the real one has scrolled out of view. Done well, shoppers barely notice it. Done badly, it covers the content they're trying to read. This guide covers when a sticky cart helps, when it gets in the way, what Shopify's Dawn and Horizon themes already do on their own, and when an app like Sticky Cart, which we build, is worth adding before Black Friday on November 27, 2026.

The short version

  • A sticky add-to-cart bar belongs on long product pages, where shoppers scroll well past the buy button before they decide. On short pages it just duplicates a button that's already on screen.
  • Horizon has one built in. In current versions it's the Sticky add to cart bar checkbox in the product page's Product information section, and it's on by default.
  • Dawn doesn't. Its Sticky header and Sticky content settings keep the header and (on desktop) the product details in view, but there's no sticky buy bar on mobile.
  • The rules that matter: show only after the real button has scrolled away, show the variant it will add, keep it to one slim row, and don't stack it on top of chat, cookie or promo bars.

What a sticky add-to-cart bar is

It's a small bar fixed to the bottom of the screen on a product page, usually with a thumbnail, the title, the selected variant, the price and an Add to cart button. It's not the same as a sticky header, which keeps your logo, menu and cart icon at the top: that helps shoppers reach the cart, not add to it. "Sticky cart" can also mean a cart summary that follows shoppers around the store; some apps, ours included, do both.

When a sticky cart helps, and when it annoys

A sticky bar earns its space when the buy decision happens far below the button. That's typical for:

  • Long product pages with detailed descriptions, size charts, care instructions, FAQs or embedded reviews.
  • Considered purchases, where shoppers read everything before they commit.
  • Phones, which show far less of the page at once than a desktop screen.

It gets in the way when:

  • The page is short. If the button never leaves the screen, a second copy only covers your photos.
  • It shows up too early, while the real button is still visible, so shoppers see two Add to cart buttons at once.
  • It adds the wrong thing. A bar that doesn't show which size or color it will add invites mistakes and returns.
  • It competes with other bottom bars: a chat bubble, a cookie banner, a promo bar and the sticky cart all fighting for the same 80 pixels.
When a sticky add-to-cart bar should show on a phone: hidden while the main Add to cart button is on screen, shown once the shopper scrolls past it into the description and reviews, and hidden again at the footer WHEN THE BAR SHOWS Add to cart 1 · TOP OF PAGE Bar hidden The real button is on screen. A second one would only cover the photos. 2 · READING ON Bar slides up The button has scrolled away. Description, sizing, reviews: the buy decision happens here. 3 · FOOTER Bar hides again Links, newsletter sign-up and policies stay reachable. Horizon's built-in bar does exactly this.
A good sticky bar stays out of the way until the real button has scrolled off screen, and gets out of the way again at the footer.

We won't quote a conversion lift here: the only number that matters is your own. Turn it on, compare add-to-cart rates on your product pages over a few weeks, and keep it if it helps.

What Dawn and Horizon do natively

Horizon: a sticky add to cart bar is built in

Shopify added a sticky add to cart bar to Horizon in version 3.2, released in December 2025. To find it, go to Online Store → Themes → Customize, open a product template, and select the Product information section. The Sticky add to cart bar checkbox sits under the layout settings, and it's checked by default.

Illustration of the Horizon theme editor on a product template: the Product information section's settings, with Width, Media position, Equal columns, Limit product details width, Gap, and the Sticky add to cart bar checkbox turned on Customize · Default product SECTION Product information LAYOUT Width Page Full Media position Left Right Equal columns Limit product details width Gap 48 Sticky add to cart bar Background color On by default in Horizon 3.2 and later
Horizon's product page settings. Illustration based on Horizon's theme code; your version's panel may look slightly different.

Horizon's bar follows most of the rules in this guide on its own:

  • It appears only after the main buy buttons have scrolled above the screen, and hides again when the footer comes into view.
  • It shows the product image, title, selected variant and price. When shoppers change a variant on the page, the bar updates to match.
  • On phones it spans the full width of the screen and keeps its controls above the home indicator.
  • If the selected variant is sold out, the button is disabled and says so.
  • It hides itself when the Shopify Inbox chat is active on the page, so it doesn't sit on top of the chat button.

What it doesn't have: a variant picker in the bar (it adds whatever is selected in the main form), a quantity field, or anything outside product pages. If that's enough for you, you don't need an app.

Dawn: sticky header and sticky content, but no buy bar

Dawn has two related settings, neither of which is a sticky add-to-cart bar:

  • Sticky header, in the Header section, with the options None, On scroll up, Always and Always, reduce logo size. It keeps the cart icon reachable, which is useful but not the same thing.
  • Sticky content, in the product page's main section. It keeps the product details column in view while shoppers scroll the images, but only on screens 750 pixels wide and up, so it does nothing on a phone.

Many other themes have a sticky add-to-cart option in the product section, sometimes turned off. Check your theme editor first. For other mobile basics, see our guide to optimizing your Shopify store for mobile users.

Design rules for a mobile sticky cart

Anatomy of a good mobile sticky add-to-cart bar: a phone showing a product page with a slim bar at the bottom holding a thumbnail, the product title, the selected variant Sand / M, the price and an Add to cart button, with four numbered design rules A BAR THAT HELPS DESCRIPTION REVIEWS Linen shirt Sand / M · $68 Add to cart 1 2 3 4 1 Show the variant it will add Size and color, not just the product name. 2 One clear, thumb-sized button Same words as the main button. 3 Slim, and clear of the home bar One row. Content stays readable above it. 4 Nothing else stuck to the bottom Chat, cookie and promo bars need their own space.
Four rules that separate a helpful sticky bar from an annoying one.
  1. Only after the real button scrolls away. Two Add to cart buttons on one screen look like a mistake.
  2. Respect variants. Show the selected size and color, or let shoppers pick one in the bar. Never add a default variant the shopper didn't choose.
  3. Don't cover content. One slim row, hidden at the footer so policy links and newsletter sign-up stay reachable.
  4. Make it easy to tap, and keep focus visible. WCAG 2.2 sets a minimum target size of 24 by 24 CSS pixels, and asks that a focused control is never entirely hidden by content like a sticky bar. Tab through your product page with a keyboard to check. More in our guide to accessibility on Shopify.
  5. One bottom bar at a time. Decide whether chat, cookies, promos or the sticky cart owns the bottom of the screen on product pages. Black Friday messages fit better in the top announcement bar; see countdown timers and announcement bars for Black Friday.

Adding a sticky add-to-cart bar to your store

On Horizon

  1. Go to Online Store → Themes → Customize and open your product template.
  2. Select Product information and check Sticky add to cart bar.
  3. Repeat for each product template you use.
  4. Save, then open a long product page on your phone and scroll.

On Dawn or a theme without the option

You can have a developer build one into the theme, or use an app. Our app, Sticky Cart, adds a sticky add-to-cart bar to product pages with a variant selector in the bar itself, and shows a cart summary with the item count and total on every other page. It works on mobile and desktop, and you can set its colors to match your theme.

  1. Install Sticky Cart from the Shopify App Store.
  2. Go to Online Store → Themes → Customize, open App embeds in the sidebar, turn Sticky Cart on, and Save. The embed is also where you set the bar's colors.
  3. Use display rules to choose where the bar appears: by page, product, collection, customer or market.
  4. Optionally add a banner message to the bar: a custom announcement, a countdown timer or a free shipping progress bar.

Shopify built-in vs Sticky Cart

Horizon (built in) Dawn (built in) Sticky Cart app
Sticky add-to-cart bar on mobile Yes, on by default No Yes
Shows only after the main button scrolls away Yes — Bar stays visible as shoppers scroll
Variant choice Uses the variant selected on the page — Variant selector in the bar
Cart summary on other pages No No (sticky header keeps the cart icon) Item count and total
Banner messages in the bar No No Custom, countdown, free shipping progress
Where it shows Per product template — Rules by page, product, collection, customer, market
Cost Included Included Free plan; paid plans from $4.99/month

The free plan includes the sticky add-to-cart and checkout bars and one custom banner message. Free shipping progress bars, countdown banners, page display rules and customer and market targeting are on the paid plans. Current plans are on the App Store listing.

Test it before Black Friday

Test on a real phone before the code freeze in our Black Friday and Cyber Monday checklist, about two weeks out:

  • Scroll a long product page: the bar should appear only after the main button is gone.
  • Change size and color, tap the bar's button, and confirm the cart has that variant. Try a sold-out variant too.
  • Open your chat widget and cookie banner, and check nothing overlaps, on a small phone and a large one.

If something doesn't work

  • Horizon's bar never appears. Check the checkbox on the specific product template the product uses, and that the page is long enough for the buy buttons to scroll off screen. If Shopify Inbox chat is active on the page, Horizon hides the bar by design.
  • No Sticky add to cart bar setting in Horizon. Your Horizon version is older than 3.2; update the theme.
  • The app's bar doesn't show after installing. Check the Sticky Cart app embed is on under Online Store → Themes → Customize → App embeds. App embeds need turning on again if you switch to a different theme.
  • Two sticky bars at once. You have both your theme's bar and an app's bar turned on. Pick one and turn the other off.

Common questions

Does Shopify have a sticky add to cart button?

Not as a platform feature, but some themes have one. Horizon has a Sticky add to cart bar setting in its Product information section, on by default. Dawn doesn't. Other themes vary.

Is a sticky add-to-cart bar good for conversion?

It can help on long product pages, especially on phones, and won't on short ones. Measure add-to-cart rate on your own pages before and after rather than trusting a generic figure.

Will a sticky cart slow down my store?

Horizon's bar is part of the theme, so there's no extra app to load. Any app adds some code to your pages; check your speed after installing, and see why a Shopify app can slow down your store.

How do I stop the sticky bar covering my chat button?

Horizon hides its bar when Shopify Inbox chat is active. With other chat apps, move the chat button, or limit where the sticky bar appears with display rules if your app has them.

Keep the buy button within reach

If you're on Horizon, check that the setting is on and test it on your phone. If your theme doesn't have one, or you want a variant selector in the bar, a cart summary on every page and banners, install Sticky Cart from the Shopify App Store. There's a free plan, so you can try it on your own product pages before the holiday rush. For more ideas, read our conversion tips for a new Shopify store, and if you'd like a hand with your product pages before Black Friday, talk to us.