how to hide a collapsible row metafield when its blank

[tarekanani]

https://www.awakeningra.com/products/khnum?_pos=1&_psq=kh&_ss=e&_v=1.0 

I want to hide the collapsible row field "material powers" when its black for a product how could I do this ? 

[BSSCommerce-TA]

@tarekanani Does every product on your site not have this field?

[tarekanani]

some of them has it and some doesn't contain any info for this one 

[BSSCommerce-TA]

@tarekanani Can you show me a product that has that part?

[tarekanani]

this product has no info for this metafield

[WalkYourStyle]

Previous Question Asked and Solved

https://community.shopify.com/c/technical-q-a/can-t-get-custom-meta-fields-to-disappear-if-blank/m-p...

[tarekanani]

does this work with any theme ? and I have a multi-word metafield "material powers" How could I contain this to the code ? 

[WalkYourStyle · Accepted solution]

Instructions

1. Go to 'Online Store' -> Theme

2. In your Active Theme click on the 3 dots (...) -> Edit Code

3. In the Sections folder locate the file  'main-product.liquid' or similar. 

4. Find {%- when 'collapsible_tab' -%} 

5. Below the {%- when 'collapsible_tab' -%}  you will see something like this

{%- when 'collapsible_tab' -%}
  <div class="product__accordion accordion quick-add-hidden" {{ block.shopify_attributes }}>
    <details id="Details-{{ block.id }}-{{ section.id }}">
      <summary>
        <div class="summary__title">
          {% render 'icon-accordion', icon: block.settings.icon %}
          <h2 class="h4 accordion__title inline-richtext">
            {{ block.settings.heading | default: block.settings.page.title | escape }}
          </h2>
        </div>
        {% render 'icon-caret' %}
      </summary>
      <div class="accordion__content rte" id="ProductAccordion-{{ block.id }}-{{ section.id }}">
        {{ block.settings.content }}
        {{ block.settings.page.content }}
      </div>
    </details>
  </div>

6. Surround everything in an if statement like this:

{%- when 'collapsible_tab' -%}
  {% if block.settings.content != blank or block.settings.page.content != blank %}
  <div class="product__accordion accordion quick-add-hidden" {{ block.shopify_attributes }}>
    <details id="Details-{{ block.id }}-{{ section.id }}">
      <summary>
        <div class="summary__title">
          {% render 'icon-accordion', icon: block.settings.icon %}
          <h2 class="h4 accordion__title inline-richtext">
            {{ block.settings.heading | default: block.settings.page.title | escape }}
          </h2>
        </div>
        {% render 'icon-caret' %}
      </summary>
      <div class="accordion__content rte" id="ProductAccordion-{{ block.id }}-{{ section.id }}">
        {{ block.settings.content }}
        {{ block.settings.page.content }}
      </div>
    </details>
  </div>
{% endif %}

This should work

[tarekanani]

thanks this worked !

[rachp528]

@WalkYourStyle I've tried this and I'm getting this errors, ideas? I added the following only, did I miss something or place in the wrong place?

{% if block.settings.content != blank or block.settings.page.content != blank %}

[WalkYourStyle]

You forgot to close the if statement like this : {% endif %} at the end

[rachp528]

Thank you!