Guides

Sticky Add to Cart on Shopify: When a Sticky Bar Helps and How to Judge It

A sticky add to cart bar keeps the buy button in reach on long product pages. When it is worth turning on, why phones come first, what the button should say, and how to tell whether it is actually working.

Nudgesmart Team
5 min read
Live exampleMarée — Fullscreen (Cinemagraph)Install free
On this page

Important Notice: This content is for educational purposes only. Results may vary based on your specific business circumstances, industry, market conditions, and implementation. No specific outcomes are guaranteed.

The button a shopper needs is often a scroll away

On a phone, the Add to cart button disappears after one swipe. A shopper who scrolls down to read reviews, check the size guide or look at more photos has to find their way back up before they can buy. A sticky add to cart bar is a small bar that slides up at the bottom of the screen once the theme's own button has scrolled away, so the button is always in reach.

This guide covers when that is worth doing and how to set it up well. To get an answer for your own store, the sticky add to cart tool for Shopify asks a few questions about your theme and pages and previews the bar as a real store widget.

Check your theme first

Several themes already ship a sticky bar, including Horizon, Prestige, Symmetry and Focal, usually behind a setting on the product page. Two bars on one page compete for the same space and confuse shoppers, so look in the theme editor before adding another. If your theme has one switched on, either keep it or turn it off and use a different bar, not both.

Phones first

The case for a sticky bar is strongest on a phone, where the screen is short and the button scrolls away quickly. On a computer, the buy area often stays in view, and many themes keep the product details pinned beside the photos as you scroll. Start with phones only. If most of your visits come from computers and your pages are long, you can try all devices later and compare.

Short pages need it least. If there is little below the button, a shopper is rarely far from it anyway.

What the bar should show and say

  • The option they picked. A bar that adds a different size from the one selected is worse than no bar. The safest bars press the theme's own Add to cart button, so the size or colour the shopper picked is the one that goes in the cart.
  • Plain button wording. Your theme's own Add to cart words are usually right, because shoppers then see the same words for the same action. Keep any custom text short and free of urgency words.
  • Price when the page is long. On a long page the price has scrolled away with the button, so showing it in the bar helps. On a short page it only repeats what is still on screen.
  • Room for everything else. A bottom bar must not cover chat buttons, cookie banners or the cart drawer. Bars that hide while a drawer or popup is open, near the footer and while the shopper is typing stay out of the way.

How to tell if it is working

A sticky bar can get more people to tap Add to cart without getting more people to buy. Some of those shoppers would have scrolled back up anyway, and some never check out. So judge it on sales per visitor, not on add-to-cart taps. Note your sales per visitor in Shopify's analytics for a few weeks before you turn the bar on, then compare the same number for a few weeks after, and change nothing else on the page in between.

Next step

Check your theme editor for a built-in sticky bar, then open the sticky add to cart tool to get a recommendation and preview the Sticky add to cart widget from the Nudgesmart app. You publish it from the app and add it to your product page. The other store widgets are in the store widget gallery.

For how a sticky bar fits with reviews, size guides and the other blocks on a page, see which product page widgets earn their place.

Tags

  • product-page
  • store-widgets
  • mobile
  • conversion
  • ux

Written by

Nudgesmart Team

Practical guides from the team that builds Nudgesmart

Put it into practice

Popups built for this

Each one is running live. Open one to see it on desktop, or install free and it is waiting in your template library.

Browse all templates
  • Scratch Cards · food

    Scratch and Save — Bold
    Loading…

    Scratch and Save — Bold

    Scratch Cards · food

    Demo only — nothing is saved, no code issued.

    Desktop view
    Loading…

    Scratch and Save — Bold

    Scratch Cards · food

    Demo only — nothing is saved, no code issued.
    Install free
  • Announcements · pets

    Pets — Bond Image A · Signature
    Loading…

    Pets — Bond Image A · Signature

    Announcements · pets

    Demo only — nothing is saved, no code issued.

    Desktop view
    Loading…

    Pets — Bond Image A · Signature

    Announcements · pets

    Demo only — nothing is saved, no code issued.
    Install free
  • Notification Bars · beauty

    Carbon-Neutral Shipping — Botanical
    Loading…

    Carbon-Neutral Shipping — Botanical

    Notification Bars · beauty

    Demo only — nothing is saved, no code issued.

    Desktop view
    Loading…

    Carbon-Neutral Shipping — Botanical

    Notification Bars · beauty

    Demo only — nothing is saved, no code issued.
    Install free
Free tools

Work out the numbers first

Get started

Turn the traffic you already have into customers.

Install it and pick a template. Or book fifteen minutes and I’ll do the first one with you, on your store — that call costs you nothing either way.

Not ready yet? Get new posts by email.

New posts when I publish them. Unsubscribe anytime.