The Snippet Configurator needs a wider display to show you the live storefront preview alongside the editor. Open this page on a desktop or laptop to start customizing.
A floating add-to-cart pill that stays visible as customers scroll, delegating to the native product form — no duplicate cart logic
In-stock state — click the button to demo the confirmation
Leave blank to inherit the text from the native Shopify button. Fill in to override with custom text.
Text shown briefly inside the button after a successful add-to-cart.
Shown when no variant is selected. Clicking the sticky button scrolls the page to the variant picker.
Shown when the selected variant is unavailable. The button is disabled in this state.
If disabled, the entire snippet renders nothing — no HTML, CSS, or JS is output.
When enabled, the selected variant price is displayed inside the sticky button.
If enabled, the sticky button only appears after the native add-to-cart button has scrolled out of view. Disable to always show.
Extra distance subtracted when scrolling to the variant picker. Increase if the sticky button appears too early on your theme.
Controls the visual style. Glass adds a frosted-glass effect. Native copies the theme's existing ATC button CSS classes.
{%- comment -%}
============================================================
STICKY ATC BUTTON — Ecom & Co. Snippet Generator ------------------------------------------------------------
What it does: Floating add-to-cart pill that stays visible as
customers scroll. Delegates to the native product
form — no duplicate cart logic.
Paste into: Shopify → Customize → (product section) → Custom Liquid