The Add to Cart button is configured to display when your store and products are set to allow purchasing. With one click, customers can add products to the cart, making it easy for customers to check out or quickly add additional products to their cart.

Add to cart button on product page, using Cornerstone theme.

When the Add to Cart button isn't showing on product or category pages, customers won't be able to easily add products from the storefront, leaving your store partially or even completely down for them and leading to a loss in sales. If you notice that the button is missing, use the following checklist to make sure everything is set up correctly.

 
 

Button Missing from Every Product

If every product page is missing the Add to Cart button, make sure:

 
 

Button Missing for Some Products

If only one or some products are missing the Add to Cart button, edit the product and check the following settings:

  • The product's availability must be set to either This product can be purchased in my online store or This product is coming soon but I want to take pre-orders. When editing products, you can find this setting under the Purchasability section, or on the Product Details tab if you are on the v2 experience.
  • If the product is set to track inventory, the stock level must be more than 0. 
  • Products with required options, such as checkboxes, may not display the Add to Cart button until the option is selected. You can check this by selecting an option on the product page and seeing if the button shows.
  • If you are on the v2 experience, your product's SKUs have one value assigned from each available option in the option set. SKUs are automatically created for each option combination in the v3 experience.
  • If you are using the latest version of the product list, access the Edit inventory screen to confirm that Availability is toggled on and that the Stock value is greater than the Safety stock value.
 
 

Checking Theme Customization

Another possibility is that customization to the template files has prevented the Add to Cart button from displaying. To view template files, you will need to edit your Stencil theme files.

Changes to the following files, such as the addition of Javascript, can potentially conflict with the Add to Cart button:

  • product.html
  • add-to-cart.html
  • header.html
  • footer.html
  • any snippets or panels referenced in the above files

Although changes to these files are the most common design-related causes for problems with the Add to Cart button, this is not a comprehensive list. If you hired a developer to make changes to your website, we recommend contacting them to troubleshoot their changes, or posting in the Community Q&A Themes & Design group if you would like advice on making this update yourself.

If you would prefer to hire a new developer, consider using the Agency Design Request to place a design and customization job request with a BigCommerce partner.