Add to cart button far down on phones
On a phone, shoppers have to scroll past more than 2 screens of gallery and text before they reach the button that buys the product.
Checked on: product pages · Zolvio’s check: “Add to cart button far down on phones”
Why it costs you sales
On a phone, a product page’s blocks stack one above the other: gallery, description, specifications, reviews. When they all come before the buy button, a shopper who has decided to buy has to scroll past screen after screen to find it, and a shopper still deciding doesn’t see it until they’ve scrolled that far.
How Zolvio detects it
Zolvio opens each product page at 375 pixels wide, the width of a typical phone, and finds the product’s buy button: the first visible Add to cart button of the product form. It measures how far down the page the button sits, in phone screens. More than 2 screens down flags the page, and the finding says how far down it is.
Pages that request files from public code libraries (such as jsDelivr, unpkg, cdnjs, or jQuery’s and Bootstrap’s sites) aren’t judged: the audit’s browser doesn’t load other companies’ files, so a carousel built from them stays unbuilt in it, and everything below sits lower than shoppers see it.
Members-only pages aren’t judged: a page without an add-to-cart form that shows a password or verification form in its content, such as a lock app’s (Easy Lockdown, Locksmith) or a VIP sign-in in the theme. A sign-in box in the header, the footer, a pop-up or a drawer doesn’t count, since it’s on every page. Neither is a product page used for a consultation or a quote: one without an add-to-cart form whose main content asks the shopper to request a quote, talk to a specialist or book a consultation. An ask your buyable product pages show too, such as a banner on every page, doesn’t count.
This finding is reported after AI review: on paid plans with AI turned on, the AI agent checks it against the audit’s evidence before it reaches your issue list. Audits without AI report only the 22 measured checks.
How to fix it
- In the theme editor, open the product template and move the Buy buttons block up, right below the title, price and variant picker.
- Move long blocks, such as the description, specifications and collapsible tabs, below the Buy buttons.
- If the gallery shows every image one under another on phones, check your theme’s product settings for a mobile layout that shows one image at a time.
- If you keep the long layout, turn on your theme’s sticky Add to cart bar if it has one, or add one with an app from the Shopify App Store.
In Zolvio: on paid plans with AI turned on, the guided fix writes these steps for your own store and theme: where to click in Shopify admin or the theme editor, or which file to open, the line to find and the code to add. Each file opens in Shopify’s code editor. Zolvio never edits your theme: you make the change, then Verify fix checks your published theme for code changes (or you mark it fixed), and later audits confirm the problem is gone.
Common questions
Why does “Add to cart button far down on phones” cost a Shopify store sales?
On a phone, a product page’s blocks stack one above the other: gallery, description, specifications, reviews. When they all come before the buy button, a shopper who has decided to buy has to scroll past screen after screen to find it, and a shopper still deciding doesn’t see it until they’ve scrolled that far.
How does Zolvio detect “Add to cart button far down on phones”?
Zolvio opens each product page at 375 pixels wide, the width of a typical phone, and finds the product’s buy button: the first visible Add to cart button of the product form. It measures how far down the page the button sits, in phone screens. More than 2 screens down flags the page, and the finding says how far down it is. Pages that request files from public code libraries (such as jsDelivr, unpkg, cdnjs, or jQuery’s and Bootstrap’s sites) aren’t judged: the audit’s browser doesn’t load other companies’ files, so a carousel built from them stays unbuilt in it, and everything below sits lower than shoppers see it. Members-only pages aren’t judged: a page without an add-to-cart form that shows a password or verification form in its content, such as a lock app’s (Easy Lockdown, Locksmith) or a VIP sign-in in the theme. A sign-in box in the header, the footer, a pop-up or a drawer doesn’t count, since it’s on every page. Neither is a product page used for a consultation or a quote: one without an add-to-cart form whose main content asks the shopper to request a quote, talk to a specialist or book a consultation. An ask your buyable product pages show too, such as a banner on every page, doesn’t count.
How do I fix “Add to cart button far down on phones” on Shopify?
In the theme editor, open the product template and move the Buy buttons block up, right below the title, price and variant picker. Move long blocks, such as the description, specifications and collapsible tabs, below the Buy buttons. If the gallery shows every image one under another on phones, check your theme’s product settings for a mobile layout that shows one image at a time. If you keep the long layout, turn on your theme’s sticky Add to cart bar if it has one, or add one with an app from the Shopify App Store.
Related
- CriticalProduct pageNo add to cart button on the product page
- HighMobileText too small to read on mobile
- HighMobileNo mobile navigation menu
- MediumMobileButtons and links too small and too close to tap
Documentation
- How audits work — What an audit scans and how findings become issues.
- Guided fixes — Step-by-step fixes written for your theme, with links into the code editor.
- Heatmaps — See where shoppers tap and how far they scroll, on mobile and desktop.