Skip Navigation

[Resolved] Split: Using WooCommerce cross sales for conditional display

This thread is resolved. Here is a description of the problem and solution.

Problem:
The customer asked how to hide the WooCommerce cross-sales section when there are no products in it.

Solution:
Guided to include some custom CSS code to hide that section in the view's "No Items Found Text" field.

Relevant Documentation:
n/a

This support ticket is created 2 years, 4 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Karachi (GMT+05:00)

This topic contains 2 replies, has 2 voices.

Last updated by Diego Walter Ricciardi 2 years, 4 months ago.

Assisted by: Waqar.

Author
Posts
#2424711

Excellent.
One last thing Waqar.
I've been trying to show/hide in the conditional block a container and I can't work out how.
In templates > wooSinglePage
There's 2 containers, the 2nd one has yet another template for showing cross_sales, I would like to hide the entire container if the product in question doesn't have cross_sales. But I can't seem to make it work, I tried with the shortcode wpv-woo-related_products if not empty show, but idk.

#2424743

Hi,

Thank you for contacting us and I'd be happy to assist.

To hide the container for the "Productos Relacionados" when the view to show the cross-sell products ( 'Cross-sell-Final' ) has no results, you can follow these steps:

1. In the container block for this view, you can include a special class "cross-sell-container".
( screenshot: hidden link )

2. Next, in the view's "No Items Found Text" field in the "View Loop" block, you can include the following CSS code, that hides the container with the special class "cross-sell-container":
( screenshot: hidden link )


<style>
.tb-container.cross-sell-container {
display:none;
}
</style>

As result, whenever this view will have no results, the CSS code that hides the cross-sell products container, will be applied.

regards,
Waqar

#2424879

My issue is resolved now. Thank you!

Wow excellent. I was thinking about just using a display none but didn't figure out the logic.
Thank you!