Redirect to cart when item added to cart- Simple theme

New Member
2 0 0

Hello! I'd like to go straight to cart after clicking add to cart on the product pages instead of it just adding the item to the cart on a drawer notification above on the Simple theme. Please help! Thank you!

0 Likes
Shopify Staff
Shopify Staff
510 0 56

Hey there, 

I'm Ann, from the team here at Shopify :)

You can change that in your theme's settings! Just follow these steps: 

  1. From your Shopify admin, click on Online Store>Themes.
  2. Where you see the Simple theme, click to customize it.
  3. That will bring you to your storefront editor. From the menu on the left, click on 'General Settings'.
  4. Then scroll down in that menu and click on 'Cart'.
  5. That will give you the option to uncheck the box that says Stay on current page when item is added to cart.
  6. Don't forget to hit 'Save'!

I hope this helps! If you have any more questions or concerns feel free to reach out to us here :) 

Have a great one,
Ann

Ann | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
New Member
2 0 0

Hi Ann! Thanks for your reply. Unfortunately I don't see a 'General Settings' on the menu to the left. I tried going into the 'Checkout' tab (which has a cart icon) in search of that box but the "stay on current page when item is added to cart" option is nowhere to be found. I'm attaching a snapshot of the options I do have for your reference. Let me know if there's anything else I can do to change this. Thanks again for looking into this! 

0 Likes
New Member
1 0 0

that´s my problem too, have you found a solution?


@CaroC wrote:

Hi Ann! Thanks for your reply. Unfortunately I don't see a 'General Settings' on the menu to the left. I tried going into the 'Checkout' tab (which has a cart icon) in search of that box but the "stay on current page when item is added to cart" option is nowhere to be found. I'm attaching a snapshot of the options I do have for your reference. Let me know if there's anything else I can do to change this. Thanks again for looking into this! 




 

0 Likes
Explorer
51 6 21

So it is a pretty simple fix to make your site redirect to the cart page after adding the product. It just requires you to add one line of JavaScript to your theme.js file. This file can be found under your assets folder. You will want to look for this chunk of code which should be around line 1168:

 

    enableAjax: function() {
      this.selectors.$addToCartBtn.on('click', function(evt) {
        evt.preventDefault();
        $('.errors').remove();
        var $addToCartBtn = $(this),
          $addToCartForm = $(this).closest('form'),
          $addToCartText = $(this).find('span');
        if ($addToCartForm.length) {
          $addToCartBtn
            .data('add-to-cart', $addToCartText.text())
            .prop('disabled', true)
            .addClass('btn--ajax-disabled');
          $.ajax({
            url: '/cart/add.js',
            dataType: 'json',
            type: 'post',
            data: $addToCartForm.serialize(),
            success: function() {
              // reupdate cart count
              theme.afterCartLoad();
              $addToCartBtn.prop('disabled', false);
              $addToCartBtn.removeClass('btn--ajax-disabled');
              addToCartflip($addToCartBtn);
              /*paste in this line of code*/
              window.location.replace("/cart");
            },
            error: function(XMLHttpRequest) {
              var data = eval('(' + XMLHttpRequest.responseText + ')');
              var response = data.description;
              var status = XMLHttpRequest.status;
              $addToCartBtn.removeClass('btn--ajax-disabled');
              if (status === 422) {
                $addToCartText.text(theme.strings.soldOut);
              } else {
                $addToCartBtn.prop('disabled', false);
                $addToCartText.text($addToCartBtn.data('add-to-cart'));
              }
              $addToCartBtn.after('<p class="errors">' + response + '</p>');
            }
          });
        }
      });
    },

Then you will want to add this line of code where I added it in the above code, you will see a comment where I put that code:

 

 

window.location.replace("/cart");

That is it, you can see a working example on my test store https://simple-related-test.myshopify.com/collections/t-shirts if you need help setting this up let me know!

 

0 Likes