Image specifications product metafield in collapsible row

[TrendBlend]

Hello, I currently have a collapsible row on my product page, showing all specifications of the product, but I want to add a specification image in the same collapsible row underneath the metafield with the specifications IF the specification image EXISTS ONLY. But the problem is when I try to add it to the store, the metafield 'Specificatie Bestand' does not show when I try to add it to the collapsible row. 

[Sonya_2025]

Hi @TrendBlend 

You need to add some customization liquid code in this block to achieve your needs.

If you can find where theme code implement the product spec function, then you can add the image into the code.

Which theme are you using? I can find you a solution if it is a free theme

[TrendBlend]

Hello @Sonya_2025, im using dawn theme

[Sonya_2025]

ok. which block are you using

[Sonya_2025]

Hi @TrendBlend 

Pls follow below steps to achieve your needs.

1. Open the theme code editor

2.Find main-product.liquid from the section fold.

3.Paste the code to the marked place

                      {% if block.settings.heading == "Product Specificaties" and product.metafields.custom.specification_image !=blank %}
                         {{ product.metafields.custom.specification_image | image_url: width: 360 | image_tag }}
                      {% endif %}

Hope this helps.

[TrendBlend]

Hello @Sonya_2025 , the image still does not show underneath the collapsible row 'Product specificaties' URL: SlimCharge - Mini Power Bank – TrendBlend

[Sonya_2025 · Accepted solution]

Oh, your tab headline text is "Product specifications", use the below code instead. and see if it is works.

{% if block.settings.heading == "Product Specifications" and product.metafields.custom.specification_image !=blank %} {{ product.metafields.custom.specification_image | image_url: width: 360 | image_tag }} {% endif %}

Feel free to send a DM to me if you need any further assistance

[TrendBlend]

hello @Sonya_2025 , thank you it is working, is it also possible to center the image?

[Sonya_2025]

Try this code instead to center the image

                      <div style="width:100%; text-align: center">
                      {% if block.settings.heading == "Product Specifications" and product.metafields.custom.specification_image !=blank %}
                         {{ product.metafields.custom.specification_image | image_url: width: 360 | image_tag }}
                      {% endif %}
                      </div>