Add a sticky add-to-cart bar on mobile when users scroll past the hero. Product image, name, price, variant picker.
Want more control? See the expanded prompt ›
Add a sticky add-to-cart bar that shows on mobile when users scroll past the hero. Include product image, name, price, and variant selector.
- Mobile-only sticky bar that slides up after the hero scrolls out of view.
- Variant-aware: hides when sold out, syncs with the main buy box.
- Around 2 KB of JS, uses IntersectionObserver — no scroll listeners.
- Compatible with both AJAX cart drawers and standard cart redirects.
What you're trying to do
Mobile shoppers lose sight of the add-to-cart button as they scroll the product page. A sticky bar keeps purchase one tap away — and on stores with long PDPs (reviews, ingredient lists, FAQ), it routinely lifts mobile add-to-cart rate by 5–15%.
Things to watch out for
- Desktop vs mobile — Fudge handles this: the bar is mobile-only by default so it doesn't interfere with your existing desktop layout.
- Hero collision — Fudge handles this: the bar appears only after the user scrolls past the hero, so the first impression stays clean.
- Variant selectors — Fudge handles this: the bar respects sold-out variants and disables the button accordingly.
- Cart drawer compatibility — Fudge handles this: works with both AJAX cart drawers and standard cart redirects.
How Fudge does it
Fudge duplicates your live theme into a draft, edits the relevant template (product, cart, or checkout) with the changes your prompt requires, and tests against your real product data. Everything starts in draft — preview on any product or in the cart, tweak any detail, and publish when you're ready. Your live store stays untouched.
Why sticky add-to-cart bars work on mobile
On mobile PDPs, the buy box scrolls out of view fast. A sticky add-to-cart bar that appears once the hero scrolls past — with product image, name, price, and variant selector — keeps the conversion moment always one tap away.
When this is worth building
Build sticky ATC for any store with meaningful mobile traffic and long PDPs. Skip for short PDPs where scroll is minimal.
What makes one great
- Mobile only — desktop doesn’t benefit.
- Appears past hero — IntersectionObserver triggered.
- Image, name, price, variant — all buy-ready info.
- Brand-styled — matches the rest of the PDP.
Pair this with variant-aware stock urgency and trust badges and guarantees row.