Make product collapsible tab disappear if empty

[Ked]

Hi, I would like the the collapsible tabs to disappear in case they are empty since not all of this products have those descriptions included.

My store is: https://gqe85oezhfsnd274-50820350128.shopifypreview.com

 

[Dan-From-Ryviu · Accepted solution]

Hi @Ked 

You can try to add this code to Custom CSS in Online Store > Themes > Customize > Theme settings and check 

at-collapsible:has(.collapsible-content__inner:empty) {
    display: none;
}

[Ked · Accepted solution]

Doing that now, Thanks for your assistance. I'll let you know if it works 

[Ked · Accepted solution]

It works 🎉

Thank you 🙏 

[Dan-From-Ryviu · Accepted solution]

Hi @Ked 

You can try to add this code to Custom CSS in Online Store > Themes > Customize > Theme settings and check 

at-collapsible:has(.collapsible-content__inner:empty) {
    display: none;
}

[Ked · Accepted solution]

Doing that now, Thanks for your assistance. I'll let you know if it works 

[Ked · Accepted solution]

It works 🎉

Thank you 🙏 

[Dan-From-Ryviu · Accepted solution]

Very welcome!

[Sajat]

Hi @Ked 

Welcome to Shopify Community.

You can disable the view if the page content on those blocks are empty.

You can change your main-product to achieve this.

Go to Online Store -> Themes -> Customize

Search for the file main-product.liquid.

Search for the code  {%- when 'collapsible_tab' -%}

Insert the following code right below the above code.

{% if block.settings.page.content != null %}

& put  {% endif %} right above
{%- when 'quantity_selector' -%}

This should do the trick.

Thank you.

Sajat

-------------------------------------------------------------------------------------------
If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.