WooCommerce: Recently Viewed Products (Shortcode)

Currently, you can use a widget to have the user see the list of products they recently viewed. This is great and sooner or later it will also become a Gutenberg block I believe.

But for now, let’s create our own shortcode… and let’s take advantage of the existing [products] shortcode and learn how we can “pass” product IDs to it without the need of reinventing the wheel.

This snippet teaches you where recently viewed products are stored (spoiler: in a cookie) and also how to use an existing shortcode… inside a new shortcode. Enjoy!

“Recently viewed” section after using my brand new [recently_viewed_products] WooCommerce shortcode

PHP Snippet: Create a [recently_viewed_products] Shortcode

Note: if you see no recent products it’s because you still need to have a Recently Viewed Products widget active. Thankfully there is a fix if you don’t need the widget: https://businessbloomer.com/woocommerce-recently-viewed-products-shortcode/#comment-246536

/**
 * @snippet       [recently_viewed_products] Shortcode - WooCommerce
 * @how-to        Watch tutorial @ https://businessbloomer.com/?p=19055
 * @author        Rodolfo Melogli
 * @compatible    WooCommerce 3.6.2
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */

add_shortcode( 'recently_viewed_products', 'bbloomer_recently_viewed_shortcode' );

function bbloomer_recently_viewed_shortcode() {

	$viewed_products = ! empty( $_COOKIE['woocommerce_recently_viewed'] ) ? (array) explode( '|', wp_unslash( $_COOKIE['woocommerce_recently_viewed'] ) ) : array();
	$viewed_products = array_reverse( array_filter( array_map( 'absint', $viewed_products ) ) );

	if ( empty( $viewed_products ) ) return;
	
	$title = '<h3>Recently Viewed Products</h3>';
	$product_ids = implode( ",", $viewed_products );

	return $title . do_shortcode("[products ids='$product_ids']");
  
}

Where to add this snippet?

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 files - if you need more guidance, please take a look at my free video tutorial "Where to Place WooCommerce Customization?"

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 Customization?

Check out these free video tutorials!

  • how-to-edit-woocommerce-with-php-snippets
  • woocommerce-hooks-add_action-list-visual
  • woocommerce-customize-single-product-page-PHP

Rodolfo Melogli

Author, WooCommerce expert and WordCamp speaker, Rodolfo has worked as a WooCommerce freelancer since 2011. His goal is to help entrepreneurs and developers overcome their WooCommerce nightmares. Rodolfo loves travelling, chasing tennis & soccer balls and, of course, wood fired oven pizza.

25 thoughts on “WooCommerce: Recently Viewed Products (Shortcode)

  1. Great snippet! I tried to limit the number of products to 4, but I didn’t succeed.
    Can anyone help me?

    Thanks!

    1. You should study this and change the “return” part of the snippet accordingly: https://docs.woocommerce.com/document/woocommerce-shortcodes/#section-6

  2. Hi,
    i have added your code, but when i see my website and without viewing any products today the history tab will be blank, that means when i visit some products yesterday , they will not showup in history tab, only the today’s viewed products is seen, otherwise the page getting blank . please help me as soon as possible.

    1. WooCommerce sets a cookie, so if your browser clears cookies or such cookie lasts for only 24 hours, there is no solution to your problem. Sorry

  3. You should add `orderby=’post__in’` to the shortcode attributes, otherwise it will sort posts by title. There is an `array_reverse` used in code but it’s pointless without this attribute

    1. Ah nice, good to know Nick! Thank you

  4. You are just awesome!
    Thank you so much for this website…helped me out so many times! 🙂

    1. Great!

  5. Hi Rodolfo :), great snippet!

    I’ve discovered that the “woocommerce_recently_viewed” cookie is stored only when the Recently viewed products widget is in use. If you want to use your code without the widget, you need to track the viewed products by your own: https://github.com/woocommerce/woocommerce/issues/9724 So you might add a note about it to the post 😉

    Cheers from Prague!
    Karolína

    1. Ahoy Karolina! Thanks so much for this, I will add it in the notes 🙂

  6. Hi there,

    I just added the code to my child functions.php file. But in several browsers the recently viewed product does not show up.
    I added the shortcode into the html of my homepage to make them visible over there. But not showing.

    What am I doing wrong?

    Thank you in advance.

    1. Hi Steff, maybe you have cookies disabled?

  7. Hello, Rodolfo
    I added the code in funcions.php and it is working, but I would like to control the quantity of products displayed and limit the 1 line, since it is showing all products recently viewed and this is loading the page a lot. In case I added it to the cart page! how to control the boundaries of displayed products and limiting the display to only 01 line on desktop and Mobile (with arrows for side drag) ?? thank you

    1. Hi Joao, just add parameters to the returned shortcode: https://docs.woocommerce.com/document/woocommerce-shortcodes/#section-8

  8. Thanks for the code. When I echo the [recently_viewed_products] shortcode it orders the products by name in ASC. Is this normal behaviour? When I var_dump $product_ids the order is ok, but $product_ids are used in [products ids='$product_ids'] shortcode, the order changes to product name. Is there any solution for ordering by view?

    1. Not perfect solution, but I have limited the number of products in the $viewed_products array.
      $viewed_products = array_slice($viewed_products, 0, 5);
      Now the [recently_viewed_products] shortcode displays the latest 5 recently viewed products. Order is not correct but now it shows the latest 5 products.

      1. Cool!

  9. How can I display only image of “Recently Viewed Products”, without Titles and Prices?

    1. Hello Valentine, thanks so much for your comment! Yes, this is definitely possible, but I’m afraid it’s custom work. If you’d like to get a quote, feel free to contact me here. Thanks a lot for your understanding!

  10. Thanks for the code. The shortcode only works for me when I have the WooCommerce recently viewed widget active on a sidebar somewhere in my site. Otherwise it seems the cookie doesn’t get created. Is this normal behaviour?
    Thanks

    1. Hi Nick. By looking at the function wc_track_product_view(), this triggers on the single product page OR if the widget is active, so it should work no matter what. Let me know

  11. how do i put it on widget sidebar ?

    1. Hello Arie, in the sidebar you can actually use the WooCommerce “Recently Viewed” widget

  12. I am using Widgets to show Recent Viewed Product on right side on the shop page.

    1. Cool! This, instead, is a shortcode than can be used on a page/post too

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.