Sticky add to cart bar
On a product page, once the Add to cart button has scrolled up out of view, a bar slides in along the bottom of the screen with the price and its own Add to cart button, so shoppers can buy without scrolling back. On a computer it also shows the product's name. It comes with the theme and needs no setup.
What it shows
- The price of the chosen options. When a shopper picks another size or colour, the bar's price changes with the price beside the options.
- The same button. The bar's button adds to the cart exactly as the main one does, with the chosen options and quantity, and then reads as the main one does, such as "1 in cart".
- Choose options. When a product has options and none is chosen yet, the button reads Choose options. It scrolls back to the options instead of adding.
The bar hides again when the main button comes back into view. It never covers your footer: the page keeps room for it at the bottom.
Where it does not show
The bar is only for products a shopper can add in one step: simple products and products with options. Grouped and external products, and products that are out of stock, keep only the main button. Without JavaScript the page has the main button only.
Remove it
The bar is a group of blocks at the end of your product template, after the reviews: the product's title, its price and an Add to cart button.
- Go to Appearance → Editor → Templates and open Single Product.
- Scroll to the end of the template and select the bar. In the list view it is the last Group before the footer.
- Delete it and select Save.
To bring it back, open the template's options and choose Reset, which returns the template to the theme's.