Sticky CTA
A sticky CTA pins the primary action — usually add-to-cart — to the viewport as the shopper scrolls. It's one of the most reliable mobile PDP wins.
Sticky CTA
A primary call-to-action that stays pinned to the viewport as the shopper scrolls, keeping add-to-cart one tap away.
A sticky CTA is a persistent button — almost always add-to-cart on a product detail page — that remains fixed to the bottom (or occasionally the top) of the viewport as the shopper scrolls past the original in-page button. The pattern exists because long PDPs push the real CTA off-screen within the first two or three swipes on mobile, and asking the shopper to scroll back to buy is friction you can remove with one line of CSS.
It's a staple of PDP optimization on Shopify, Woo and Magento stores, and one of the few changes that reliably lifts mobile add-to-cart rate without touching pricing, imagery or copy.
On a typical apparel PDP, the original add-to-cart button sits below the price and size selector — roughly 600-800px down the page. A mobile shopper scrolls past it within two swipes while skimming images, reviews and the size guide. From that point onward, every second they spend reading is a second the buy action isn't visible.
A sticky CTA collapses that distance to zero. The button reappears as a slim bar (typically 56-72px tall) once the original scrolls out of view, carrying the same label, price and — ideally — the selected variant. Most stores see a 3-12% lift in mobile add-to-cart rate from the change alone, with the high end concentrated in long-scroll verticals like beauty, supplements and electronics.
ATC_lift_% = ((ATC_with_sticky − ATC_baseline) / ATC_baseline) × 100
ATC_with_sticky
Add-to-cart rate with sticky CTA
Sessions that hit add-to-cart, divided by PDP sessions, during the variant exposure window.
ATC_baseline
Baseline add-to-cart rate
Same metric measured on the control PDP without the sticky bar.
ATC_lift_%
Relative lift
Percentage change in ATC rate attributable to the sticky CTA.
A Shopify apparel store runs a 14-day A/B test on its top 50 PDPs, mobile traffic only.
Baseline mobile ATC rate: 8.4%
Variant mobile ATC rate (sticky CTA): 9.2%
Mobile PDP sessions per variant: 42,000
→ Relative ATC lift = ((9.2 − 8.4) / 8.4) × 100 = +9.5%
A 9.5% lift on 42k sessions is roughly 336 extra add-to-carts per variant over the test window. At a 28% cart-to-purchase rate and €58 AOV, that's around €5,460 in incremental mobile revenue from one CSS change.
The magnitude of the lift depends mostly on how long the PDP is and how mobile-heavy the traffic is. Beauty and supplements PDPs — with ingredient lists, reviews and FAQs stacked below the fold — tend to gain more than minimalist apparel pages where the original button is rarely far from view.
Typical mobile ATC lift from sticky CTA, by vertical and PDP length
| Vertical | Median PDP scroll depth | Mobile traffic share | Typical ATC lift |
|---|---|---|---|
| Apparel & accessories | 1,800px | 72% | +3-6% |
| Beauty & skincare | 3,200px | 78% | +7-12% |
| Supplements & wellness | 3,800px | 74% | +8-12% |
| Consumer electronics | 4,100px | 61% | +5-9% |
| Home & furniture | 2,400px | 58% | +2-5% |
| Food & beverage (subscription) | 2,900px | 70% | +4-8% |
Two implementation details matter more than the rest. First, the sticky bar must reflect the currently selected variant — if it shows a generic 'Add to cart' while the size dropdown is empty, you'll trade one friction point for another. Second, on iOS the bar needs to clear the home-indicator safe area; otherwise the tap target sits under the system gesture zone and conversion can actually fall.
Sticky CTA: frequently asked questions
Trigger it the moment the original in-page button scrolls out of the viewport — not earlier. Showing it before the original button is off-screen creates a duplicate CTA and tends to suppress lift slightly because shoppers register two competing buttons.
Usually not worth it. Desktop viewports are tall enough that the original button stays visible longer, and a floating bar can clash with chat widgets and announcement bars. Most of the documented lift comes from mobile; test desktop separately if at all.
Negligibly, if implemented as CSS position:fixed with no third-party script. Apps that inject a sticky bar via a heavyweight loader can add 50-150ms to LCP, which on Shopify mobile is enough to wash out the conversion gain. Prefer a theme-level implementation.
Same pattern, more detail. The expanded version includes a product thumbnail, title and price alongside the button — useful on long PDPs where the shopper may have forgotten which variant they were looking at. The thumbnail version usually adds another 1-2 points of lift on top of the plain button.
Match the original PDP button. Switching labels between the in-page and sticky CTA confuses shoppers and breaks the mental model. If you want to test 'Buy now' as a label, test it on both buttons together.
No — there's no single product to add. On collection pages the equivalent pattern is a sticky filter bar. Sticky CTAs only make sense where a single primary action exists, which is almost always the PDP.
It's one of the cheapest wins in a PDP optimization program — usually first or second in the test backlog after price-and-shipping clarity. It pairs well with variant-selector cleanup, review placement and image-gallery tweaks, since all four target the same long-scroll friction.
Two full business weeks at minimum, and long enough to hit your minimum detectable effect. For a baseline mobile ATC of 8% and a 5% relative MDE, you'll need roughly 35-40k sessions per variant — most mid-size stores can cover this in 10-14 days on PDP traffic.
Rarely, but worth checking. If the sticky button skips variant validation or adds an incomplete configuration, you'll see cart abandonment rise even as ATC climbs. Always read the test out on ATC, cart-to-purchase and revenue per visitor together — not ATC alone.
Not necessarily. Most modern Shopify themes (Dawn, Impulse, Prestige) ship with a built-in sticky add-to-cart toggle. For older themes, a snippet of Liquid plus 20 lines of CSS handles it. App-based implementations exist but trade speed for convenience.
Get an AI expert review of your site
Paste your URL — Metricuno's AI runs the same heuristic checks a senior CRO consultant would, scoring your page and prioritising the fixes that'll move conversion fastest.