How to call a metaobject field that is filled from a metaobject

Technical Q&A
1

Hi,

I have created a metaobject called “Merken” with the type: “merk”.

It has the fields:

“merk_logo” which is an image

“collectie_url” which is an url

“merknaam” which is a single line text

“beschrijving” which is a multi line text

There are currently 3 “merken” in this metaobject with there details.

I have added the product metafield called “Merk” with namespace and key: “custom.merk” and referenced it to the metaobject “Merken”.

This way on every product in the front-end I can now select the “Merk” metafield and choose the responding brand. By doing this I only have to enter the brand details once in the metaobject and can change these whenever I want. This is working great so far and I can use it in the customizer to call info about the brand to put it in a dynamical way in a section on all product pages.

Now, I am making some custom code in order to show the corresponding brand image besides the product name on every product page. I have tried different ways but I can not seem to find how I can call this field from the metaobject. I am using the Dawn theme.

I am editing code in the main-product.liquid file.

When I call {{ product.metafields.custom.merk}} it prints: gid://shopify/Metaobject/41277063501

and {{ product.metafields.custom.merk.beschrijving}} gives me nothing.

When i call:

{%- for merk in shop.metaobjects.merk.values -%}

{{ merk.beschrijving}}

{%- endfor -%}

It gives me the “beschrijving” but now for every “Merk” in the metaobject. So Text works only I don’t get it to show for only the corresponding product brand. So the product.metafield.

When I call:

{%- for merk in shop.metaobjects.merk.values -%}
Merk logo
{%- endfor -%}

It is not able to get the image url and displays only the alt text 3 times.

When I call:

{%- for merk in shop.metaobjects.merk.values -%}

{{ merk.merk_logo | image_url: '50x' }}

{%- endfor -%}

It prints:

gid://shopify/MediaImage/47634749882701

gid://shopify/MediaImage/47606216163661

gid://shopify/MediaImage/47634749981005

So it gets something but not the image url to show.

What code would get me the corresponding “merk_logo” image for the product on the product page? I know I am doing something wrong here but I do not seem to find the solution with this problem. The above is mostly debugging and seeing what is shown with a call but nothing seems to get the image or the text “beschrijving” for only that product, associated with 1 brand. It is really exciting tech but the dev docs are a little small and compressed with little info regarding the metaobjects.

Thanks in advance for the support!