Metafield Text - Is it possible to change its appearance (e.g. Bold, Italic)

[solosglasses]

As stated in the topic, does anyone know is it possible to change meta field data text appearance? 

For example, I would like to bold the Recommended Face Size content on the product page but this text is here in the dynamic meta fields.

Thanks

[Ahsan_ANC · Accepted solution]

plz use the bold/strong tags on the page where this field will be shown

<strong> metafield here </strong>

[solosglasses]

Thank you!

[sweetbuddie]

Hi where dose this code go please i need bold text in meta fields multi line

[Ahsan_ANC]

Hi @sweetbuddie  where do you want to show the meta field?

[sweetbuddie]

product page please

[Ahsan_ANC]

[sweetbuddie]

i need some text in bold it will differ between different products as allergy ingredients have to be in bold by law

[Ahsan_ANC]

please share some data so I can have a look at which type of data it is and how it will look.

[sweetbuddie]

Ingredients

For allergens please see ingredients listed in bold.

Sugar, Glucose Fructose Syrup, Invert Sugar Syrup, Wheat Flour, Corn Starch, Vegetable Fat (Palm), Acids (Malic Acid, Citric Acid), Humectant (Glycerol) Potato Stach, Maltodextrin, Flavouring, Thickening Agent (Arabic Gum), Acidity Regulator (Potassium Citrates), Salt, , Fruit and Vegetable Concentrates (Carrot, Blackcurrant).Colour (E120)

an example of a products ingredients tab i need with WHEAT in bold

[Ahsan_ANC]

HI @sweetbuddie please follow this guide carefully. It's a little bit tricky. First, go to the product editor, and in the meta-field add the ingredients. now for words you want to show as bold, wrap them around with pipeline ( | ) as shown in the screenshot below.

Now go to the theme editor and open the file 'main-product.liquid' in the sections folder. now replace the code highlighted in the below picture with the new code below.

code

 {% if block.settings.heading contains 'Ingredients' %}
              {% assign beatles = block.settings.content | split: "|" %}
               {% for member in beatles %}
                  {% assign value = forloop.index | modulo:2 %}
                  {% if value != 0  %}
                  {{ member }}<b>
                    {% else %}
                  {{ member }}
                   </b> {% endif %}
                {% endfor %}
              {% else %}
              {{ block.settings.content }}
                {% endif %}

[sweetbuddie]

How silly Shopify dose not offer this naturally thanks alot it has worked

could you help me out with something else so the same with the tabs just i have a collapsible row products Nutritional Values and i need a table in it so it looks like the photo dose not have to loo exactly this this

and also i have another tab Dietary And Lifestyle as a file list tab i added the photos but nothing is showing up on the website

[Ahsan_ANC]

Please share the store URL and also how many products in total you have.

[sweetbuddie]

sweetbuddies.co.uk password Scarr123 i will be having over 100 products

[Ahsan_ANC]

Hi @sweetbuddie  this will require multiple code changes in your store

[sweetbuddie]

i'm up for it 😎

[Ahsan_ANC]

are you easy with making code changes by yourself?

[sweetbuddie]

yea i have done abit

[Ahsan_ANC]

please copy the code of main-product.liquid file and paste it into the following google doc file. 

https://docs.google.com/document/d/1ooUpb_3vGSyc28EB4FDGPZYU5X9J053_IAgKaSMWnKA/edit?usp=sharing

[sweetbuddie]

ok think i did it

[RenV]

Hi @Ahsan_ANC, thank you so much, it works! But the code is limited to one metafield, do you know how I can adapt the code, so that it will be valid for all existing metafields?

Thank you!

[Darkons]

Hello but, it didn't work for me. Here is the metafield's content:

Here is the output:

Am I doing something wrong?