List WooCommerce Products by Tags

Here is a quick way to list WooCommerce products by tags using a simple shortcode. To use it, simply place the following shortcode within your pages:

[woo_products_by_tags tags=”shoes,socks”].

I created a simple plugin to do the job. Simply copy and paste the code below in new file called “woocommerce-products-by-tags.php” within a “wp-content/plugins/woocommerce-products-by-tags” folder.

 

53 responses to “List WooCommerce Products by Tags”

  1. Ed

    This is a wonderful to use!
    just one question, how would the code look like so that all products are next to each other in same style as if we would click on a tag in the site? (included clickable picture ext…)

    the original would be http://yourdomain.be/shop/product-tag/nameoftag/

    thx in advance
    Ed

  2. Peter Sejersen

    Great addition to WooCommerce!

    Would it be possible to make something similar with product attributes? That would be really cool for creating great landing pages.

    1. yes i think that’s doable, in keep that in mind for another post!

  3. Katy

    Thank you so much for this code. You turned a long search into a quick fix!

    1. Glad you like that snippet!

  4. demlaip

    Nice Code !
    Only Problem is: it only fetch the product images based on tags.

    will you please help us out in getting the shortcode for displaying product loop based on Tags at anywhere on webpage.
    the product loop I’m talking about is available right now at :http://goo.gl/LTVpa2

    It would be really helpful to get your response at earliest.

    Thanks,
    demlaip

  5. Maria

    I seem to have issues, I’ve copied & pasted the code into the woocommerce-products-by-tags.php and then called the shortcode in one of my pages but it doesn’t read, it just reads the shortcode, that’s all. please help?

    1. make sure you activate the plugin and use the corerct shortcode.

  6. Marlon

    Is it possible to make the pictures clickable?

  7. kim

    Hello – Thanks for the great plugin! I see the products listed but they do not link to the product page. How is this possible? Thank you

    1. Do you experience any other permalinks trouble? That should work fine to be honest.

      1. kim

        I don’t. This is the only instance. It lists all the products by thumbnail but there are no links to the actual products.

        1. Max

          You can get the links around the product titles with $product_id:
          echo ‘‘.get_the_title($product_id).’‘;

          1. Max

            Didn’t all show up, here it is:
            http://pastebin.com/ggxBYi72

          2. rwlee33

            Hey Max, thanks for this. I don’t know exactly where to paste/replace this in the original code. Can you provide a reference line?

            I have tried it several places, but it seems to be on the same line as the thumbnail and the formatting is funny. Ideally, I’d replace the product title with this code and make a new line for the thumbnail. Thanks for the help!

          3. rwlee33

            Hey, I got it working! Instead of title with link, I linked the thumbnail.

            Here’s an example of a blog post from a datafeed that uses the shortcode to insert products from the same store. What do you think?
            http://www.designbykathryn.com/swayy-luxury-au/10-off-all-luxury-vintage-brands

  8. kim

    also, how would I modify the code to keep the product name centered above the thumbnail? Thanks!

  9. Rakesh

    It’s awesome !
    Thank’s

  10. Jan

    Thanks Remi, but I got following error when trying to add a tag on a product:

    Warning: Cannot modify header information – headers already sent by (output started at /home/www/xxxxx/wp-content/plugins/woocommerce-products-by-tags/woocommerce-products-by-tags.php:1) in /home/www/xxxx/wp-content/plugins/woocommerce/classes/class-wc-session-handler.php on line 63,

    1. It’s probably a little php error such as open/closed php tags incorrect, please double check.

  11. Max

    Thanks for this code, very cool. It seems similar to what I need to do in my project, but in this case I need to list products by custom field values for a given key. Do you know what I need for that process?

    1. You can use the code provided in this post and adjust it using meta_key and meta_value in the query args: http://codex.wordpress.org/Class_Reference/WP_Query#Custom_Field_Parameters

      1. Max

        Thanks Remi, yes simply adding to args worked great:
        “meta_key” => “mymetakey”,
        “meta_value” => ” “

        1. Max

          Actually it doesn’t filter by the various values, only all products with that key. Any ideas how to get the correct filtering for the values?

        2. Hello,

          could You show how should the whole code look like? I tried to modify plugin but I failed : (

          Ps. Remi – Good work! I’ve searched this solution half a day!

          1. The code is full man, just copy and paste into a file that you place in a custom folder in wp-content/plugins, and boom the magic appears!

          2. @Remi: Your code is 100% – I use it and like it! My previous comment was connected to @Max case:

            ” It seems similar to what I need to do in my project, but in this case I need to list products by custom field values for a given key.”

            Is it possible to change tags for custom_fields which are used to products?

            Max said that:
            “Thanks Remi, yes simply adding to args worked great:
            “meta_key” => “mymetakey”,
            “meta_value” => ” “”

            But I’m not a programmer and have a bit problem with it.

  12. timebinder

    Great plugin to display highly related items through my site, but isn’t it supposed to also link to the respective product, rather than just display the products image?

    thanks
    Gavriel

  13. leodesigner

    Hi Remi,
    I just purchased your plugin and it has been a life/time saver. I was just wondering if its possible for the results to include a link to the product as opposed to just its name and an image? Or is it supposed to be doing that already and I’m just doing something wrong. Any help would be appreciated. Thanks.

    – Leo

  14. profnimrod

    Here is a suggested change that makes all the product images clickable:

    function woo_products_by_tags_shortcode( $atts, $content = null ) {
    // Get attribuets
    extract(shortcode_atts(array(
    "tags" => ''
    ), $atts));
    ob_start();

    // Define Query Arguments
    $args = array(
    'post_type' => 'product',
    'posts_per_page' => 100,
    'product_tag' => $tags
    );
    // Create the new query
    $products = new WP_Query( $args );

    $woocommerce_loop['columns'] = $columns;

    if ( $products->have_posts() ) : ?>

    have_posts() ) :
    $products->the_post(); ?>

    <?php endif;

    woocommerce_reset_loop();
    wp_reset_postdata();

    return '' . ob_get_clean() . '';
    }

    add_shortcode("woo_products_by_tags", "woo_products_by_tags_shortcode");

  15. rnbronstein

    This didn’t work for me — any help? Do I need to use it in addition to your code? I’m trying to create another way of accessing the list of products — basically making it easier to parse. So having it clickable is key.

    Also, I can’t figure out how exactly to put in my own placeholder thumbnail. I specified $uploads, the file path, and the dimensions, but that didn’t work: echo ''; (I’m probably messing up something with all those commas…)
    Thanks in advance.

    1. rnbronstein

      Derp. I don’t know where all that comment went? I probably shouldn’t have used the code tag. What I typed was echo ”;

  16. BoTbird

    Have you tested this with 3.9 yet?
    I’m really amazed there isn’t a plugin or a pre-existing built in solution for this.
    Thanks!

  17. cinders

    Excellent plugin, the original code works though it will not allow the products to be selected or listing in column fashion only vertically down the page.

    So I tried the code that allows the products to be selected and got this outcome:

    http://www.sunviewblinds.co.uk/black-blinds/

    If anyone can offer a fix I would appreciate it as we would really like to get the products listed by tag and be able to be sorted by slug and choose how many columns they are listed by.

    Thank you in advance.

    Nathan

  18. Panchoo18

    i was using it with no problem, and suddently show me this:

    Fatal error: Call to a member function plugin_url() on a non-object in /home/ivi0/caja22lr.com.ar/wp-content/plugins/woocommerce-products-by-tags/woocommerce-products-by-tags.php on line 59

    what´s the problem? thx

    1. mcymer

      I had the same error, because the $woocommerce global variable wasn’t accessible. Adding the following at the top of the woo_products_by_tag_shortcode function helped:

      global $woocommerce;

      -Mirek

      1. BritneyMuller

        Where did you add global $woocommerce; ?

        Couldn’t get that to work…

  19. xonek

    Hi Remi !

    Amazing snippet and plugin and BIG THANKS for sharing it with us.
    I’m trying to use it in my website to display products on pages, but I have some issues. Is it possible to display the output in columns (by columns I mean the default woocommerce columns)? By using your code above I can display the products only in 1 column.

    Would be much appreciated if someone could help!

    Thanks

  20. Alaa

    Hi Sir,
    I hope everything is good with you,
    Thanks for your nice plugin,
    Please,
    Do you know how can i make the following :
    Please, I need you help,
    Ex:
    The product category is: the product type (e.g Accessories)

    The product tag is: the city (e.g USA).

    I added these to the post if I check it.

    Now I need a modified code to filter the query by city and product type, How can i do that?.

    Best regards
    A.J.

  21. rogerg

    Hi,

    I am trying to get a shortcode to display the products by tag. (In this case we are using the tag feature for the products brand names). I believe I have followed your instructions but the actual shortcode shows on the frontend and not the relevant products which we tagged. What have I done wrong?
    Regards,
    Roger

  22. jtibbles

    Thanks for the tutorial. I ran in to issues regarding $woocommerce->plugin_url() …it didn’t know what $woocommerce was.

    Also how could I go about adding a previous and next page link to the bottom?

    Many thanks

  23. nandangse

    Same Problem here, Can you please help me to get things work for me ?

    1. jtibbles

      nandangse I managed to do it using some information provided at http://callmenick.com/post/custom-wordpress-loop-with-pagination.

      Here is my solution – it’s a bit dirty because I’m using a none-restful / url friendly approach…

      1) Add this before query arguments:
      $paged = ( $_GET[‘page’] ) ? $_GET[‘page’] : 1;
      2) Add this to the query arguments:
      ‘paged’ => $paged,
      3) Here’s the dirty bit…under the endwhile put the following:

      1) echo ‘Prev‘; ?>

      <?php if($pagedmax_num_pages) echo ‘Next‘; ?>

      …you can clean up part 3 if you’re following a more standard approach ie http://www.yourdomain/somepath/page/1/ , where you can utilise the get_next_posts_link( ‘Prev’, $the_query->max_num_pages ) and get_previous_posts_link( ‘Next’ ) method mentioned on that link.

      1. jtibbles

        Ah sorry, the cut/paste has messed that comment up. Could you please remove. How do I post code? thanks

  24. popocat85

    Hi, nice plugin :)
    you can create a list of only tags? For example in a shop of clothes there will be tags with link:
    shoes
    pants
    skirts
    clothes

    like to index… Tanks and sorry for my bad English.

    1. popocat85

      Hi, sorry for my English, I asked the wrong thing, because I have not read very well.

      The plugin is great!
      But I not have link to title product and image product, I try use: echo ''.get_the_title($product_id).''; but I do not know where paste it.

      The same problem I have (where and how to paste) whit code by "profnimrod" on April 6, 2014 at 9:22 pm .

      Maybe because I use wordpress 4.2.2.?

      Please, I need you help.
      Many thanks

  25. stefoosh

    Hi Remi,
    This code was a godsend. Thank you so much!!
    My question now is how can I get the images sized properly? Currently all the images are showing up in different sizes and while they are aligned left, each single image is taking up the entire row. I’ve tried changing theshop_catalogue values around to try and get thumbnails but nothing is working. I would love to have them in grid style if possible, but will settle for just being able to size them all consistently! here’s the link so you can see what i’m talking about: http://aloha-couture.com/boutiques/birds-of-paradise/

    Thanks in advance!!

    1. stefoosh

      Also worth mentioning, I integrated Max’s code, but edited it so the images were linkable instead of the titles.

  26. Trynex

    Hi, thx for code. I have one question.. Lets say I have 2 products. 1st has tags “London” and “trip”. The second has only the “London” tag. And they are both displayed even though i set up the list for tags London and Trip. But I need to display only when it has both of the tags.

    Thx for responce.

  27. genest

    Nice
    But it’s not working if the tag include a space
    Example “Assiettes plates”
    Is there a solution?

  28. fusiontribal

    I’ve tried the plugin from WP v.4.5.3 and I have this error:

    Fatal error: Call to undefined method WooCommerce::get_image_size() in /home/content/f/u/s/xxxxxxx/html/hosting/xxxxxxx/wp-content/plugins/woocommerce-products-by-tags/woocommerce-products-by-tags.php on line 57

    The line 57 refers to:
    echo get_the_post_thumbnail($loop->post->ID, ‘shop_catalog’);

    Anyone has idea about how to resolve this issue?

    By the way, Remi Corson should develop this plugin and sell it at codecanyon. Just think about.

  29. anton

    Thanks for the code Remi. I used a variation of this together with the code from Bruno found here: http://bbird.me/listing-woocommerce-products-by-tags/

    How can you sort the listings by price descending or ascending?

    At the moment it sorts by title.

Leave a Reply