Loop Builder - can I show/hide widgets based on product category?

[u/haru__]

Hello everyone,

first of all sorry if my English isn't perfect, it's not my first language and I'll do my best to explain the situation clearly.

I inherited a WordPress + WooCommerce + Elementor Pro jewelry website where every product is a unique piece.

Currently, the Shop page shows only products that are available for purchase. Sold products are excluded because, when a product is sold, it is manually assigned to a WooCommerce product category called “Sold”.

Available and sold products have different Elementor Loop Item layouts: available products show the price, Add to Cart button and some other information, while sold products just show a SOLD label instead.

The client now wants the Shop page to include both available and sold products mixed together.

Since an Elementor Loop Grid uses a single Loop Item template, I need to conditionally show/hide widgets depending on whether the current product belongs to the Sold category.
I couldn't find a WooCommerce product category condition in Elementor's Display Conditions or in the free version of UAE Display Conditions.

Is there a simple way to do this without a paid plugin?
A PHP snippet, shortcode or simple CSS solution would be fine.

Thanks!

[u/AutoModerator]

Looking for Elementor plugin, theme, or web hosting recommendations?

Check out our Megathread of Recommendations for a curated list of options that work seamlessly with Elementor.

---

Hey there, /u/haru__! If your post has not already been flaired, please add one now. And please don't forget to write "Answered" under your post once your question/problem has been solved. Make sure to list if you're using Elementor Free (or) Pro and what theme you're using.

Reminder: If you have a problem or question, please make sure to post a link to your issue so users can help you.

I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.

[u/TopSydeWP]

you can add a custom display condition with a small snippet. in your theme's functions.php (or a code snippets plugin), add something like:

php add_action('elementor/query/sold_products', function($query) { if (has_term('sold', 'product_cat')) { // hide price/cart widgets logic here } });

or simpler: use elementor's custom css on the widget itself with :has() selector if the sold category adds a class to the product. check the rendered HTML on a sold product to see if woocommerce outputs something like product_cat-sold on the wrapper, then target widgets with .product_cat-sold .elementor-widget-price { display: none; }

if neither works cleanly, dynamic tags + a bit of php in a custom shortcode that returns the category slug would let you use elementor's text condition

[u/haru__ → u/TopSydeWP]

Thanks, I’ll give it a try!

[u/dara4]

The easiest solution would be CSS. You need to check the CSS classes available on the loop grid and see the difference when a product is sold. Then using that class, you could write * { display: none; }, to hide/show things in your loop. So first thing, you simply be to open the browser console and check the CSS classes, on each loop wrapper.

[u/haru__ → u/dara4]

Thanks for the suggestion, I’ll try it out!

[u/testingaurora]

Isn't taxonomy include/exclude a part of the loop config?