Although custom metafield support has existed in Shopify for a long time, only in the past few years did improvements to the system really make them powerful
Nowadays, Shopify's product metafields are an incredible powerful feature which allow a store to manage custom data attributes associated with any type of system object (products, collections, customers, orders, etc).
Here's an example about how I'm leveraging metafields for one of my clients, who imports hand-painted pottery from Europe.
On their store, we are using metafields to manage custom attributes about each product, such as details about the design featured on a product: the design's name, catalog code, colors, visual elements, and level of artistic complexity. Additional metafields are also used to store information about the physical item, like its size or capacity, as well as flags to indicate things to other systems, like if the price ought to be automatically managed by an autopricer tool.
This structured data enables an amazingly rich shopping experience for their customers. Combined with Shopify's awesome free "Search & Discovery" app, customers can now browse for products based on all this metafield data, such as the design elements, colors, artistic complexity, or product type.
It also allows invaluable analytical insights for the owners that enable the most optimal decision making when it comes to not only selling their products, but ordering new products from their overseas partners, which oftentimes have lead times of over a year.
I'll go into more detail about this project in a separate post later on!
For now, I'll get to the reason I wrote this post in the first place.
Make.com & Shopify : Working with Product Metafields via GraphQL
Recently, I was engineering a Make.com/Shopify/Google Sheets utility for this client where I needed to retrieve the value of specific product metafields and map them into columns in a Google Sheet
Seemed straightforward....but it turned out to be quite the rabbithole because of the way that Shopify returns the data from a GraphQL query and efficiently getting to that data in Make, which doesn't handle the returning GraphQL data as cleanly as it does the response from a REST request.
However, I was able to figure it out so I wanted to document how to do this in case it was useful to another developer working in both Make.com and Shopify GraphQL.
Step 1: Request the metafields for a specific product via the GraphQL API
As far as Shopify REST API support goes, there is and probably never will be support for metafields, so you'll have to use GraphQL for this.
Fortunately though, Make.com's Shopify app includes a "Make a GraphQL API Call Module" which makes this pretty straightforward. Assuming you've already got a connection to the Shopify store set up in Make, all you need is to specify the API version (eg : "2024-07" or whatever is most current) and use this query.
{
product(id: "gid://shopify/Product/{shopify_product_id}") { metafields(first: 20, namespace: "namespace_to_return_metafields_for") { edges { node { key value } } } } }
Just replace {shopify_product_id} with the desired product id. The namespace filter in the above example can be omitted to retrieve all metafields, or included to only retrieve those within a specific namespace.
2. Retrieving the Values of Specific Metafields
The response from this module will look something like this:
So, it returned 11 metafields from this product that matched the specified namespace.
To map this data into the right columns in the Google Spreadsheet, I need to get the values for specific keys, like "pattern-name" or "form-code", however, the data is located within a collection within an array of collections.
So how do you obtain the value for a specified key?
Well, the Make.com "map()" and "get()" functions are necessary for this. These functions allow you to work with arrays and collections (objects) without having to use costly iterator loops.
I see lots of posts about Make.com developers baffled by these functions and I admit it even took me a while to get the hang of it. The official Make.com documentation isn't very helpful as it has no examples, so it really just took some experimenting to figure it out.
This is what it should look like to get the value for "form code"
get(map(map(metafields_edges_array;"node"); "value"; "key"; "form-code"); 1)
Here's how this works:
- the innermost map() gets the collection "node" in each item in metafields_edges_array and returns an array of collections each containing a key and value
- the next map() goes through each collection in the node array looking for an attribute with the name "value" where the attribute named "key" is "form-code". This returns an array (though it will just contain one item)
- The get(array;1) returns the value of the first (and only item in the array) which I can then use in my scenario
That's it!
How To Understand the Make.com Map function
Map() is an array filter.
Here's how I remember how to use map()
"For each item in this array, return X (where the value of attribute Y is Z)"
X can be an attribute or a collection.
I hope this is helpful to you!