How can I improve the display of Liquid code in my product details?

[kazunari]

I would like to add a liquid code to my shop that would display more detailed product information. I already have this information completed using metafields. I'll add that it's the content type - Single line of text (List).

And it displays not the way I would like it to, because the "" and [] character are added. How can I get rid of them? Below is my code.

<div class="productView-bottom">
	<div class="container">
<h3 class="title"><span class="text">Product Detail:</span></h3>
{% if product.metafields.my_fields.package_quantity %}
<p>Package Quantity: {{product.metafields.my_fields.package_quantity}}</p>
{% endif %}
{% if product.metafields.my_fields.certification_and_diet %}
<p>Certification and Diet: {{ product.metafields.my_fields.certification_and_diet }}</p>
{% endif %}
</div>
</div>

Link below to an example of a product that has the data listed just before the section with related products.

https://medpak.shop/products/now-foods-zinc-50-mg-100-tablets

[kazunari]

I guess we didn't quite understand each other, because I just want to get rid of those elements marked on the screenshot.

[kazunari]

It looks like this is not the solution, as this is then what the code looks like as I remove one {} at a time.

[malyi · Accepted solution]

try add .value to metafield, like: 

<p>Package Quantity: {{product.metafields.my_fields.package_quantity.value}}</p>

[kazunari]

Yes, that helped and it displays correctly.

However, now I have another problem to solve. How can I translate all this now? First of all with the values that are in the metafields?

[malyi]

I think there no default way for metafield translation, so i think you need create something like this: 

metafield_title_en: 'Text',
metafield_title_it: 'Text italy'

{% liquid
 assign lang_code = 'en'
 if ...statement to define italic code...
  assign lang_code = 'it'
 endif 
 assign metafield_title = 'metafield_title_' | append: lang_code
%} 

<p>Title: {{product.metafields.my_fields[metafield_title].value}}</p>

[DominicMruk]

Hello @kazunari 

It seems like you values are stored in arrays(list), which you can see based on the brackets.

To show only the values you can use an array filter with custom separator as described here: 

https://shopify.dev/api/liquid/filters/join#join-custom-separator

so in your case you would use e.g.:

{{product.metafields.my_fields.package_quantity | join: ', '}}