WooCommerce: “Continue Shopping” Button @ Single Product Page

A freelance client hired me a while ago to display a “Continue Shopping” button on the Single Product Page, next to the Add to Cart. A simple way to send their users back to where they were coming from without clicking the “previous” button on the browser πŸ™‚

Here’s how it’s done, featuring an awesome WordPress function called “wp_get_referer()”!

Continue Shopping button @ WooCommerce Single Product Page

PHP Snippet: “Continue Shopping” Button @ Single Product Page – WooCommerce

 

/**
 * @snippet       Continue Shopping button @ Single Product Page
 * @how-to        Watch tutorial @ https://businessbloomer.com/?p=19055
 * @sourcecode    https://businessbloomer.com/?p=72772
 * @author        Rodolfo Melogli
 * @testedwith    WooCommerce 3.1.1
 */

add_action( 'woocommerce_single_product_summary', 'bbloomer_continue_shopping_button', 31 );

function bbloomer_continue_shopping_button() {
  if ( wp_get_referer() ) echo '<a class="button continue" href="' . wp_get_referer() . '">Continue Shopping</a>';
}

Where to add this code?

You can place PHP snippets at the bottom of your child theme functions.php file (before "?>" if you have it). CSS, on the other hand, goes in your child theme style.css file. Make sure you know what you are doing when editing such delicate files - if you need more guidance, please take a look at my free WooCommerce Customization video tutorial.

Does this snippet still work?

Please let me know in the comments if everything worked as expected. I would be happy to revise the snippet if you report otherwise (please provide screenshots). I have tested this code with Storefront theme, the WooCommerce version listed above and a WordPress-friendly hosting on PHP 7.

If you think this code saved you time & money, please join other Business Bloomer supporters and avail of 365 days of WooCommerce benefits. Thank you in advance :)

Need Help with WooCommerce?

Check out these free videos, tutorials and tips!

  • how-to-edit-woocommerce-with-php-snippets
  • woocommerce-hooks-add_action-list-visual
  • woocommerce-customize-single-product-page-PHP
  • woocommerce-customize-shop-page-PHP
  • woocommerce-advanced-customization
  • how-to-edit-woocommerce-cart
  • woocommerce-customize-checkout-page-PHP
  • woocommerce-email-customization
  • woocommerce-conditional-logic

Rodolfo Melogli

Author, WooCommerce expert, WordCamp speaker and Internet marketer, Rodolfo Melogli has worked as a WooCommerce freelancer since 2011. He helps entrepreneurs and developers overcome their WooCommerce nightmares :) Rodolfo is the organiser of WordCamp Dublin, the Dublin WooCommerce Meetup, the Dublin Ecommerce Meetup and the Dublin WordPress Meetup. He enjoys interacting with people, travelling and chasing tennis & soccer balls. Of course, he loves pizza too.

37 thoughts on “WooCommerce: “Continue Shopping” Button @ Single Product Page

  1. I can see the Continue Shopping button fine when hitting a single product page from the store front but if I just change the product name within the browser URL then it vanishes! Any ideas? The code is added to the child theme functions.php file.

    1. Hey Wayne, thanks for your comment! If you type in the URL, that URL will be counted as first visit to the website, so there is no “previous” page. Hope this helps πŸ™‚

  2. If you want to add continue buttons both on single porduct page and cart how do I do that?
    It does not work to add these code in functions.php

    add_action( 'woocommerce_single_product_summary', 'bbloomer_continue_shopping_button', 31 );
    function bbloomer_continue_shopping_button() {
      if ( wp_get_referer() ) echo '<a class="button continue" href="./shop">Continue Shopping</a>';
    }
    add_action( 'woocommerce_after_cart_table', 'bbloomer_continue_shopping_button', 31 );
    function bbloomer_continue_shopping_button() {
      if ( wp_get_referer() ) echo '<a class="button continue" href="./shop">Continue Shopping</a>';
    }
    
    1. Hey Pelle, thanks for your comment! you can’t re-declare a function with the same name, try changing that πŸ™‚

    2. How do you mean with change name on function, which parameter must I change?

    3. You can’t use “bbloomer_continue_shopping_button” twice, rename the second one to something else πŸ™‚

    4. Thanks Rodolfo! it works fine!

  3. Hi Rodolfo!

    Nice snippet! I just saw a friend’s website that had that option and remembered that I always thought it was a good idea! A little Google search and it brings me right back to your site. The best place for snippets!

    Just wondering though (I’m not a developer)… I see bbloomer in the code. Can this be changed to anything we want? Can it be removed completely? My curiosity is wondering why it’s there πŸ˜€

    1. Hey Paul, thanks πŸ™‚ Yes, that’s just the name I gave to the custom function, you can change it to anything you like.

  4. hey Rodolfo thanks for the code. have been using a modified version to add two buttons once the product is added to the cart BUT the person im helping needs the buttons removed once you navigate away from the page of the product you just added to the cart; i.e. on any other page. Or maybe the correct term is on any single product page where that product does not appear in the cart? pleeeeease help asap- have spent hours and hours and i just dont know enough. THANK YOU!!!

    1. Shane, thanks so much for your comment! Yes, this is possible – but unfortunately this is custom work and I cannot provide a complementary solution here via the blog comments. Thanks a lot for your understanding! ~R

    2. Cant you please point me in the right direction? What woocmmerce tag / function to use? Im not asking you to write it but maybe if I actually new what to search for I could make it work…?

    3. I can’t, sorry πŸ™‚

  5. Hi there,

    I’m a PHP newbie. Is there a way I can add this piece of code just under the “this product has been added to your cart” success message?

    Thanks very much in advance!

  6. Hi,

    Thank you for this post, it’s a great one for me. But I have a little problem. The Continue button is above Add button, can you help me to move it a little bit down ?

    1. Eusebiu, thanks for your comment! Yes you can achieve that via CSS. Unfortunately this is custom work and I cannot provide a complementary solution here via the blog comments. Thanks a lot for your understanding! ~R

  7. How would I add the “continue shopping” button to the shopping cart page /shopping_cart/ ?

    1. Hey Ilana, thanks for your comment! You will need to change “hook”. Instead of “woocommerce_single_product_summary” you should use one of the Cart hooks

  8. Hello,

    Thank you for sharing this. I was wondering if you could please share a snippet for adding this button to the thank you page?

    I’m currently running a focused checkout to minimize distraction but unfortunately it doesn’t give the customer an option to keep shopping.

    Thank you in advance

    1. Hey Jonee, thanks for your comment! This tutorial will show you how to add content to the thank you page: https://businessbloomer.com/customize-woocommerce-thankyou-page-tutorial/. Hope this helps

  9. hello
    The ‘continue shopping’ button disappears when the view cart message is displayed.
    How can we keep the button in place when view cart message is displayed?
    thanks.

    1. Phil, thanks for your comment! Not sure, can you provide a screenshot?

    2. This happens to me as well. Once you click add to cart, the continue shopping button disappears. Any suggestions?

    3. When you simply display single product page, button appears as it should. After adding product to basket, button is no longer added.

    4. I fixed this by removing

      if ( wp_get_referer() )

      and just going with

      echo '<br><a class="button continue" href="./shop">Continue Shopping</a>';

      in the function.

      The reason why it was disappearing is because clicking on the add to cart button refreshes the page, and if the previous page was the same page you’re on,

      wp_get_referer() 

      will return false.

  10. Thank you so much! This works perfectly – LOVE it!

    1. Thank you Lechelle πŸ™‚

  11. This is great and exactly what I was looking for, however,

    Button with continue shopping appears on single product screen but when the item gets added to the cart the page refreshes with the added to cart message and then continue shopping button disappears.

    any ideas, anyone else has that issue.

    1. Mark, thanks for your comment! Maybe in that case you should add a condition that if “wp_get_referer();” is not available it should redirect to the default Shop page?

  12. Great this is really help full

  13. Hi Rodolfo,
    Really it’s very nice way to CONTINUE SHIPPING option. But it’s redirect to previous click page only.

    β€œContinue Shopping” button on the Single Product Page, In the previous code if you click Add to cart button after then click to continue shopping button it’s not working properly.

    I had modified herf line.

    add_action( 'woocommerce_single_product_summary', 'bbloomer_continue_shopping_button', 31 );
    function bbloomer_continue_shopping_button() {
      if ( wp_get_referer() ) echo '<a class="button continue" href="./shop">Continue Shopping</a>';
    }
    

    Continue Shopping button working good.

    Thanks
    Murthi

    1. Thank you Murthi πŸ™‚

  14. Works like magic! Thanks.

    1. Thank you so much Emmanuel πŸ™‚

Questions? Feedback? Support? Leave your Comment Now!
_____
If you are writing code, please wrap it between: [php]code_here[/php]. Failure to complying with this (as well as going off topic) will result in comment deletion. You should expect a reply in about a week - this is a popular blog but I need to get paid work done first. Please consider joining #BloomerArmada to ask me 1-to-1 WooCommerce questions. Thank you :)
¯¯¯¯¯

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.