Stay on the product page when products are added to the cart

Caution

This is an advanced tutorial and is not supported by Shopify. Knowledge of web design languages such as HTML, CSS, Javascript and Liquid is required. We suggest hiring a Shopify Expert if you are not comfortable proceeding with the following tutorial.

When a customer adds a product to the cart, some Shopify themes will take them to the cart page. This customization lets customers stay on the product page after clicking the Add to cart button, so that they can continue shopping.

Stay on product page

Edit your theme code

To edit your theme code:

  1. Find the theme you want to edit, click Actions, and then click Edit HTML/CSS.

  2. In the Layout directory, click theme.liquid.

    Ajax cart
  3. Find the closing </body> tag. On a new line right above the closing </body> tag, paste the following code:

    {% include 'ajaxify-cart' %}
    
    Ajax cart 2
  4. Click Save.

  5. In the Snippets directory, click Add a new snippet:

    Add a new snippet
  6. Name your snippet ajaxify-cart, and click Create snippet:

    ajaxify-cart snippet

    Your new snippet will open in the code editor.

  7. In your new ajaxify-cart.liquid file, paste this code hosted on GitHub.

  8. Click Save.

Debut

If you use Debut, then continue to the next steps:

  1. In ajaxify-cart.liquid, find the opening <script> tag at the top of the file. On a new line right below the opening <script> tag, paste the following code:

    window.onload = function() {
    
  2. Find the closing </script> tag. On a new line right above the closing </script> tag, paste the following code:

    }
    
  3. In the same file, find the following code:

    cartCountSelector:             '.cart-count, #cart-count a:first, #gocart p a, #cart .checkout em, .item-count',
    

    Replace it with:

    cartCountSelector:             '#CartCount',
    
  4. Click Save.

  5. In the Sections directory, click header.liquid.

  6. Find the following code:

    
    {% if cart.item_count > 0 %}
    
    

    Replace it with:

    
    {% if cart.item_count > -1 %}
    
    
  7. Click Save.

Demo Store

Click here to view a demo store that lets customers stay on the product page when they add products to the cart.

Want to discuss this page?

Visit the Shopify Community