Re: Metaobject values in metafields

Solved

How can I access metaobject values in product metafields?

rdaniel
Tourist
11 0 3

Hello,

 

My store has been given access to metaobjects, and so I've started using it and setup a few metaobjects that I want to use in the metafields for products and variants. But I don't quite get how I can access the values of the meta object via the metafields?

 

I thought maybe something like this would make sense:

 

{% for metaobject in product.metafields.namespace.key %}
{{ metaobject.field.value }}
{% endfor %}

Appreciate the correct way to do this, and updating the Liquid API documentation would be very helpful.

 

Thanks.

Accepted Solution (1)
LazaEAG
Shopify Partner
4 1 6

This is an accepted solution.

Hi Rdaniel

 

Try to access all data with {{ product.metafields.namespace.values }} and then iterate through that

 

{% for metaobject in product.metafields.namespace.values %}
{{ metaobject.field }}
{{ metaobject.field.value }} {% endfor %}

 

Maybe it is not clear with those abstract names so here is a small example. 

Let's say there is a meta object Icon with 2 fields Title and Image. To get those we iterate like

        {% assign icons = shop.metaobjects.icon.values %}

        {% for icon in icons %}  
	        <div>
	            <img
	                src="{{ icon.image.value | image_url: width: 45 }}"
	                alt="{{ image.alt | escape }}"
	            >

	            <span>
	                {{ icon.title }}
	            </span>
	        </div>
        {% endfor %}

 

Try it out.

View solution in original post

Replies 28 (28)

Niklas_g
Shopify Partner
34 8 23

Hey Rdaniel, what datatyp of metafield are you using? 
Whats the output when you print {{ product.metafields.namespace.key }}?

 

Mabey your metafield value is a string? You can create an array with | split like so:

{% assign array = "value1,value2,value3" | split: "," %}
{% for value in array %}
  {{value}}
{% endfor %}

 

rdaniel
Tourist
11 0 3

As described, I'm using metaobjects.

 

When printing {{ product.metafields.namespace.key }} I get the gid reference url.

rdaniel
Tourist
11 0 3

Is there no one that can answer this? It would be poor to add such a nice way of storing information without the possibility to access the information in the frontend...?

PaulNewton
Shopify Partner
7238 638 1502

They are a new feature, so everyone's learning curve is high.

 

Thoroughly review the docs if you not simply using dynamic sources in theme settings.

Merchants start here

https://help.shopify.com/en/manual/custom-data/metaobjects

 

Devs

 

https://shopify.dev/docs/apps/custom-data/metaobjects 

https://shopify.dev/api/liquid/objects/metaobject 

Contact paull.newton+shopifyforum@gmail.com for the solutions you need


Save time & money ,Ask Questions The Smart Way


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Thank Paul with a Coffee for more answers or donate to eff.org


rdaniel
Tourist
11 0 3

Thanks,


I've read this documentation. But I can't see how it gives information on how to access values from metaobjects that are defined in metafields in example of a product. Might be something I've overlooked though...

LazaEAG
Shopify Partner
4 1 6

This is an accepted solution.

Hi Rdaniel

 

Try to access all data with {{ product.metafields.namespace.values }} and then iterate through that

 

{% for metaobject in product.metafields.namespace.values %}
{{ metaobject.field }}
{{ metaobject.field.value }} {% endfor %}

 

Maybe it is not clear with those abstract names so here is a small example. 

Let's say there is a meta object Icon with 2 fields Title and Image. To get those we iterate like

        {% assign icons = shop.metaobjects.icon.values %}

        {% for icon in icons %}  
	        <div>
	            <img
	                src="{{ icon.image.value | image_url: width: 45 }}"
	                alt="{{ image.alt | escape }}"
	            >

	            <span>
	                {{ icon.title }}
	            </span>
	        </div>
        {% endfor %}

 

Try it out.

Phil_Houghton
Shopify Partner
4 0 8

Using @LazaEAG example worked for a metaobject. But I wanted to use the metaobject as a database to store all the colour swatches for different products and select which ones I wanted to show on which product. The code above output EVERY colour swatch in the metaobject. So I made a metafield using the metaobject I had  created as the content type.

 

That way for each product I can select which colour swatches from the metaobject that I want to display.

 

Modifying the code slightly for metafield:

 

{% assign swatches = product.metafields.custom.available_colours_swatches.value %}

                {% for swatch in swatches %}  
                  <div>
                      <img
                          src="{{ swatch.image.value | image_url: width: 45 }}"
                          alt="{{ swatch.name.value | escape }}"
                      >
                      <span>
                          {{ swatch.name.value }}
                      </span>
                  </div>
                {% endfor %}

 

 

haddi
Shopify Partner
17 1 2

This should be the accepted solution; thanks!

Mohamed, web developer.
ErSanjay
Shopify Partner
321 20 47

@LazaEAG   Thanks lot for the answer.

Business Owner & Shopify Plus, Shopify app , Shopify Consultant - Full Stack Sofware Engineer
Warm regards,
Er Sanjay

If you find yourself in need of assistance with your store, don't hesitate to reach out! Feel free to send me a direct message, and I'll do my best to help you out.
ErSanjay
Shopify Partner
321 20 47

@LazaEAG  I have rich text input in the schema I was able to render the object. 


on page display this object.  but I want to render the HTML code. how I can do that?

 

{"type"=>"root", "children"=>[{"listType"=>"unordered", "type"=>"list", "children"=>[{"type"=>"list-item", "children"=>[{"type"=>"text", "value"=>"list"}]}, {"type"=>"list-item", "children"=>[{"type"=>"text", "value"=>"list 2"}]}, {"type"=>"list-item", "children"=>[{"type"=>"text", "value"=>"list 3"}]}, {"type"=>"list-item", "children"=>[{"type"=>"text", "value"=>""}]}]}]}

 

Business Owner & Shopify Plus, Shopify app , Shopify Consultant - Full Stack Sofware Engineer
Warm regards,
Er Sanjay

If you find yourself in need of assistance with your store, don't hesitate to reach out! Feel free to send me a direct message, and I'll do my best to help you out.
mcqua007
Shopify Partner
11 0 10

You can use this package to convert that rich text AST to HTML.

switchbladecomb
Shopify Partner
4 1 1

Quite late to reply here but for anyone coming to this post now, the best way to convert rich text values from metaobjects and/or metafields is to simply use the metafield_text filter, like so: 

 
{%- assign rich_text_val = shop.metaobjects.some_metaobject.some_rich_text_input | metafield_text -%}

{{ rich_text_val }}

 

switchbladecomb
Shopify Partner
4 1 1

I should also mention that using the metafield_text filter will wipe out any formatting you might actually want to maintain in the rich text value. The other option would be to use the metafield_tag filter which keeps formatting like hyperlinks and lists.

LloydSpencer
Shopify Partner
19 0 0

Hi, I'm having an issue with this code where it's getting the data from all products rather than the current product.

I've updated my code to the below:

 {% assign icons = shop.metaobjects.features.values %}
 
        {% for icon in icons %}  
        <div>
            <span>
                {{ icon.one }}
            </span>
        </div>
        {% endfor %}


I've also tried this but it doesn't work:

{% assign icons = shop.metaobjects.features.values | where: 'product_id', product.id %}

{% for icon in icons %}
<div>
<span>
{{ icon.one }}
</span>
</div>
{% endfor %}





 

LloydSpencer
Shopify Partner
19 0 0

For any one else struggling with this, I found the solution from another comment below:

{% assign licenses = product.metafields.custom.product_features.value %}
{% for license in licenses %}
<div>
<span>
{% if license.one.value == true %}
Hello One
{% endif %}
</span>
</div>
{% endfor %}



UPDATE: custom.product_features with your Namespace and key
UPDATE: the word 'one' in license.one.value with your metaobjects field name

 

studioboskant
Shopify Partner
5 1 2

Hi @LazaEAG 
So there is no way to display values from shop.metaobjects per product and not all the values from the website content?
We have to create a product metafield that contains a list of metabobjects instead of having a product metafield per metaobject right?

Phil_Houghton
Shopify Partner
4 0 8
{% assign myfields = product.metafields.custom.namespace.value %}

                {% for myfield in myfields %}  
                  <div>
                      <img
                          src="{{ myfield.key.value | image_url: width: 45 }}"
                          alt="{{ myfield.name.value | escape }}"
                      >
                      <span>
                          {{ myfield.name.value }}
                      </span>
                  </div>
                {% endfor %}
LazaEAG
Shopify Partner
4 1 6

Hi @Phil_Houghton 

First, thank you for sharing examples. And you are right, my example was some global case, I used it for one section with icons and as part of another object that has the same icons. Like you said for the product is slightly different.

Phil_Houghton
Shopify Partner
4 0 8

Thank YOU for pointing me in the right direction. Was frustrated by the lack of documentation and having no luck up until then executing what I needed to do 🙂

kaymay
Tourist
9 0 3

@Phil_Houghton Thank you for this. I didn't have to iterate so I modified your code to make it work for me.

 

Here is my code for anyone reading this in the future:

 

{% assign foo = product.metafields.custom.backing.value %}
<div>
  <img src="{{foo.backing_img.value | image_url: width: 200}}">
  <div>
    {{foo.backing_title.value }}
  </div>
</div>

 

Notes:

*This code works in Custom Liquid sections/blocks

*Replace backing with your metafield name

*Replace backing_img and backing_title with your metaobject's field names

T_Chord22
Shopify Partner
4 0 0

Hi all, I am not sure how this needs to work in other areas of shopify, such as collection page.

Basically I want to create a carousel that populates data from each entry inside of the metaobject created. I followed the above sets, but having 0 success. Below is the following code I have implemented.

{% assign pfilters = collection.metafields.custom.collection_filter.values %}

<div class="row tt-layout-product-item">

{% for pfilter in pfilters %}
{{ pfilters.collectiontitle.value }}
{% endfor %}
</div>

LazaEAG
Shopify Partner
4 1 6

Hi @T_Chord22 

You should try to debug and see where the issue appears.

 

So first check if {{ collection.metafields.custom.collection_filter.values | json }} is not empty. If it is try with {{ collection.metafields.custom.collection_filter.value | json }}  so without "s" at the end. 

 

Next step print {{ pfilter | json }}  and also the try with {{ pfilters.collectiontitle }}

T_Chord22
Shopify Partner
4 0 0

@LazaEAG thanks for the reply. I followed your steps above and it seems the only one that returns data is  {{ collection.metafields.custom.collection_filter.value | json }}

This is what it returns: {"collectionimage":"gid:\/\/shopify\/MediaImage\/33168175333688","collectiontitle":"Kitchen"}

This returns: {{ collection.metafields.custom.collection_filter.values | json }} null
This returns: {{ pfilter | json }} null
This returns: {{ pfilters.collectiontitle }} nothing

LazaEAG
Shopify Partner
4 1 6

@T_Chord22 

 

Sorry now I am guessing a bit but if you see just one filter and you have entered more the try to print  only

{{ collection.metafields.custom.collection_filter | json }}

 

And if that holds all filters then assign that to pfilters. Also I see mistake now here

 

<div class="row tt-layout-product-item">

{% for pfilter in pfilters %}
{{ pfilters.collectiontitle.value }}
{% endfor %}
</div>

 

{{ pfilters.collectiontitle.value }} is wrong, you have to target single filter so 

 

{{ pfilter.collectiontitle.value }} or {{ pfilter.collectiontitle }}

 

Try a few things 🙂 and hope you find the right solution.

KevinWang
Visitor
1 0 0

It's worded for me, thanks a lot.

jacopol
Tourist
18 0 3

Hi guys, I'm having a similar issues and don't understand what I'm doing wrong. 

I have a customer metafield containing list of metaobjects. The metafield has namespace custom and key license_new and it references a metaobject of type license which has 2 fields: 

1. reference_product: reference to the product. 
2. license_files: a list of generic files. 

I want to display the list of metaobjects, specifically a link to the reference_product and links to download the related license_files, in the customer account page. I'm attempting to do so using 

      {% assign licenses = customer.metafields.custom.license_new.value %}
      {% for license in licenses %}
        {{ license.reference_product.value }} <br>
      {% endfor %}


This doesn't seem to work and I don't understand why. 

I tried a similar approach with a simpler metafiled of key licenses that only contains a list of generic files. If I try to display the files IDs by doing 

      {% assign licenses = customer.metafields.custom.licenses.value %}
      {% for license in licenses %}
        {{ license.id }} <br>
      {% endfor %}


everything works as expected. 

Can anyone see what I'm doing wrong? Thank you 🙂 

Ciao!
ErSanjay
Shopify Partner
321 20 47

@jacopol @haddi  @LloydSpencer   As per the shopify update we can only access the public metafiled if some app has own meta filed that can't access to the theme file directly but may be different way you can access.

let me know I found this was correct to not?

I have same issue... 

Business Owner & Shopify Plus, Shopify app , Shopify Consultant - Full Stack Sofware Engineer
Warm regards,
Er Sanjay

If you find yourself in need of assistance with your store, don't hesitate to reach out! Feel free to send me a direct message, and I'll do my best to help you out.
haddi
Shopify Partner
17 1 2

I'm afraid I don't understand your question.

Mohamed, web developer.