WooCommerce: Show Product Custom Field in the Category Pages

A client asked me to show a given custom field in the loop (i.e. Shop page, Category pages, Tag pages = anywhere woocommerce products are returned). Interestingly enough, she didn’t want to show the product short description (see “show product short description on the homepage only” snippet) but a custom field, so here’s how you do it!

1. Add a Custom Field to Each Single Product

Go to the single product page, scroll down to the custom fields box, and then add a new one manually. Call it something like “loopdesc” and add the text you want to show in the product category pages.

WooCommerce Product Add New Custom Field
WooCommerce Product Add New Custom Field

2. Add PHP to your functions.php to Show Custom Field @ Loop


/**
 * @snippet       WooCommerce Show Product Custom Field in the Category Pages
 * @how-to        Watch tutorial @ https://businessbloomer.com/?p=19055
 * @sourcecode    https://businessbloomer.com/?p=17451
 * @author        Rodolfo Melogli
 * @compatible    WC 3.5.4
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */

add_action( 'woocommerce_after_shop_loop_item_title', 'bbloomer_woocommerce_product_excerpt', 35 );  

function bbloomer_woocommerce_product_excerpt() {
global $post;
if ( is_home() || is_shop() || is_product_category() || is_product_tag() ) {
   echo '<span class="excerpt">';
   echo get_post_meta( $post->ID, 'loopdesc', true );
   echo '</span>';
}
}

Here’s the final result:

WooCommerce Show Custom Field in the Loop
WooCommerce Show Custom Field in the Loop

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.

37 thoughts on “WooCommerce: Show Product Custom Field in the Category Pages

  1. This works but the custom field stays above product image , how to put it below product price ?

  2. Hi, Rodolfo!

    Usefull snippet! But, I need to show that data conditionally. If one custom field is’nt empty, show a string. That is posible?

    1. Hello Exel, 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!

  3. Works great! Thank you for this. How would i get it to show under the product title but above the price?

    1. Hello Nick, please watch this tutorial: https://businessbloomer.com/customize-shop-page/

  4. Thank You Very Mush. It helped me

    1. You’re welcome πŸ™‚

  5. didn’t work for me last woo and divi shop module

    1. It’s probably Divi’s fault and the snippet might need to be customized. Sorry πŸ™‚

  6. Hi Rodolfo,
    1. Can I show attribute in the loop?
    2. I have two custom fields but if I echo the function twice there is no space between fields.

    Thank you.

    1. Hey Vinz, thanks so much for your comment! This snippet does show custom fields in the loop πŸ™‚ Also, you can add a BR tag in the HTML to create the space. Hope this helps!

    2. Thank you Rodolfo!
      One more thing πŸ˜‰
      there is a function to limit custom fields word’s or characters number?

      1. Hey Vinz, of course there is – but I can’t help you in this case. Thanks for your understanding πŸ™‚

  7. Hi Rodolfo,
    I’ve added your snippet on my child-theme function.php. Also, added the custom field to one of my products to see if it works. I used the exact same name and everything that you have used. However, nothing is appearing on the “shop” page, but it appears on the category page. Do I need to add this somewhere else in order for it to show on, I think, the archive page?

    1. Nevermind! Figured it out. Thanks!

  8. Hello, this is great tutorials,
    But I want Show Product Custom Field in the grid categories, cant you help do it

    Thanks

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

  9. Hi Rodolfo, thank you so much for your great tutorials, that brought me from pretty much confusion to understanding woocommerce a bit and now with your help I’m able to customize a lot of things to my needs, thank you again !!

    Now I added a advanced custom date field “start_date” to my products (which are bookable events) and I want to show the products on the shop-page ordered by this date field value . I found a tutorial in the acf Documentation (https://www.advancedcustomfields.com/resources/orde-posts-by-custom-fields/) – but I cannot figure out how to customize the snippet for wc and where I have to hook it in – and how to hide the products with date in the past?
    Maybe you got an advice for me?
    Thanks a lot in advance,
    Stefanie

    1. Hey Stefanie, thanks a million for your comment! I’m afraid this is custom work so I cannot give a solution here in the blog comments. However, I found this for you – it should be more or less what you’re trying to achieve: https://www.skyverge.com/blog/sort-woocommerce-products-custom-fields/

  10. I buy some theme from Themeforest but I didnt find any custom field section in the woocommerce product, can you assist me how to add or enable custom field section in the product edit.

    1. Hey Amirul thanks for your comment! Themes don’t affect the admin product pages, so go check again – if you don’t find it send me a full screenshot of the edit product page and I’ll see if I can help. R

  11. Hello Rodolfo,
    Thank you for yet another valuable tutorial. I have one question.
    How would I show this custom field on the single product page?
    Thank you.

    1. Hey Joe, thanks for your comment! All you need to change is the “hook”; to find out what hooks are available on the single product page, just google “woocommerce single product hooks” and you’ll find my own “visual guide”, which will show you the locations as well πŸ™‚ Let me know!

  12. Hello, thanks very much for the snippet – it was very useful. I was wondering if it could be possible to show the short description on the sales shortcode. I’m using sale_products shortcode on the homepage to list the sale items and unfortunately the short description is not shown with the shortcode. Can you please help me out? Thanks in advance!

    1. Hello EylΓΌl, and thanks so much for your comment! Have you looked at this article already: https://businessbloomer.com/woocommerce-show-product-short-description-homepage? Let me know if that helps πŸ™‚

  13. How do you add these custom fields in the product data box ?
    I don’t find any option for that.

    1. Hello Karan, thanks for your comment! Did you take a look at the image I show at “1. Add a new custom field to the products” – that should help πŸ™‚

  14. How do you add these custom fields? Is it a plugin, or do I need to add something to my functions.php

    1. Hey Kyle, thanks for your comment! If you take a look at image #1, it will show you where I enter the custom field. It’s on the Single Product Edit Page, right at the bottom of the “Product Data” box. Click on “Enter New” and create your custom fields there.

      An other alternative is Advanced Custom Fields, widely used by WordPress developers!

  15. Hi, this worked great for one product, but when I try to add a second product with different custom field in functions.php…..the second doesn’t show up. It also doesn’t show up in ‘related Products listings. All I wanted to do was add one small custom field to the product category grid view…..do you have any ideas?

    1. Hi Kevin, thanks for your feedback! This PHP function does not trigger on the “single product page” (related products are there) and also it is specific to a single custom field. If you have multiple fields you simply need to echo the function twice:

      echo get_post_meta( $post->ID, ‘custom field 1’, true );
      echo get_post_meta( $post->ID, ‘custom field 2’, true );

      ..where custom field 1 and 2 are the names of your custom fields. Hope this helps!

      1. Hey Rodolfo, thanks so much for your help, it worked a treat! Perfectly. You certainly are a WP Guru!

        Kind regards….Kevin

        1. Excellent, cheers Kevin!

          1. I want to added 1 more option at woocommerce shop page. After product title and price. I have tried with the advance Custom fields plugin. I have added the field but it’s not showing the text at the products. I’m not expert. So please help me how can I add 1 or more field on the woocommerce product / shop page (for all products)

            1. Hey Shaohag, thanks for your comment! You should combine this snippet with this: https://businessbloomer.com/woocommerce-display-advanced-custom-fields-single-product/, which gives you an idea on how to echo the ACF field. Let me know πŸ™‚

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.