How can I hide blank metafields on my product page?

[OH2]

Hi community, I created my Metafields on my product page. I want to hide the metafileds that don't have information when the user is seeing the page. See attached screenshot.

Im using Dawn Them 2.0 if it helps. I haven't added any extra code to it. 

I really appreciate any help!!

[LitExtension · Accepted solution]

Hi @OH2,

Please find 'richtext' and change 'liquid'. Refer:

Then you can add conditions to show Metafields. Example for Binding:

{%- if product.metafields.my_fields.binding != blank -%}
Binding: {{ product.metafields.my_fields.binding }}
{%- endif -%}

Hope it helps!

[LitExtension]

Hi @OH2,

You can add conditions to it, for example:

{%- if product.metafields.instructions.wash != blank -%}
<!-- show metafields -->
{%- endif -%}

Hope it helps!

[OH2]

Hi @LitExtension, Thanks for your answer. I'm new here with Shopify. Can you point me out where I can add the conditions? I'm thinking I have to add it on the product.json  

[LitExtension]

Hi @OH2,

Can you send me a screenshot where you have added the option to show Metafields? i will help you check it.

[OH2]

 I added here @LitExtension 

[LitExtension]

Hi @OH2,

It's not at Metafields, where you added to show it at the frontend.

is it in Customize or in the edit theme?

[OH2]

@LitExtension I added it in the theme editor. 

[LitExtension]

Hi @OH2,

Can you send me a screenshot editor? I will check it.

[OH2]

@LitExtension  here is the Screenshot

 

[LitExtension]

Hi @OH2,

I checked and you can't add conditions here. If you want, you can just create a new section, and declare the metafields directly in the code, it will help you to add conditions to it.

Do you want to create a new section and manually declare metafields?

Please send me the code of multicolumn.liquid file, I will guide you step by step to change it 

[OH2]

@LitExtension here is the code for the multicolumn section. Thanks again for helping me!!

[LitExtension]

Hi @OH2,

It is not JSON, please send me the code file, sections > multicolumn.liquid file, I will check it.

[OH2]

HI @LitExtension, I upload the wrong file, here is the full code. 
Thanks

[LitExtension · Accepted solution]

Hi @OH2,

Please find 'richtext' and change 'liquid'. Refer:

Then you can add conditions to show Metafields. Example for Binding:

{%- if product.metafields.my_fields.binding != blank -%}
Binding: {{ product.metafields.my_fields.binding }}
{%- endif -%}

Hope it helps!

[OH2]

Hey, @LitExtension I made the changes you told me to and added the code into  product. json and is working. Let me know if this is the place where I had to add the code. Thanks again!!!

 

[LitExtension · Accepted solution]

Hi @OH2,

You just go to customize and add the code directly at Description. 

[OH2]

Thank you @LitExtension. for all your help!! 

[Tupperton]

I've added the code, but did i do something wrong? It's just showing the entire code instead:

I've added the liquid code to multicolumn as instructed:

[LitExtension]

Hi @Tupperton,

You can create a question on the community and send me the link. I will check it.
Because this will help build a better community.
Thank you.

[Tupperton]

I don't quite understand your reasoning, as it is directly related to the question above.

Nontheless i've created another question as requested 🙂 

https://community.shopify.com/c/technical-q-a/hide-metafields-when-blank-through-description/m-p/172...

[fixpc82]

Where should this code be pasted?

{%- if product.metafields.my_fields.binding != blank -%}
Binding: {{ product.metafields.my_fields.binding }}
{%- endif -%}

[MRamzan]

I just followed this video guide steps to hide the metafileds from my product page which were blank:

Video: https://youtu.be/_9rtNdM6n1A