How to use JSON data in Shopify liquid code

In the 11th article of the #4weeksOfShopifydev challenge, I'll be talking about how to use JSON data in Shopify liquid code.

In Shopify Liquid template language, they don't support JSON or objects (not product object), I have a tip  use it in Liquid.

  • First, we need to install Metafields Guru app to create metafields
  • Create new metafield under Shop settings
How to use JSON data in Shopify liquid code

Select JSON string as type and type data as key

How to use JSON data in Shopify liquid code
  • Use this JSON sample data
[
  {
    "firstName": "Ilias",
    "lastName": "Haddad",
    "email": "contact@iliashaddad.com"
  }
]
  • To consume this JSON data in Liquid, you can use this code snippet to render this JSON data
{% assign users = shop.metafields.global %}
{% for user in users.data  %}
{{ user.firstName}}  {{ user.lastName}}  {{ user.email}}
{% endfor %}

In this sinppet, we assign the global namespace metafield to users variable

{% assign users = shop.metafields.global %}

And we loop over the array of object in JSON by accessing the data key metafield

Subscribe below to get notified of new posts.

Related Posts

Convert your Shopify store to PWA for better performances (conversion)

On the 16th of the #4WeeksOfShopifyDev challenge, I’ll be talking Why you should convert your Shopify store to PWA for better performances?

What benefits of being a Shopify partner and make money using it?

On the 15th of the #4WeeksOfShopifyDev challenge, I’ll be talking about what benefits of being a Shopify partner?

Why developers should invest in learning the Shopify App or Theme development?

On the 14th of the #4WeeksOfShopifyDev challenge, I’ll be talking about why developers should invest in learning and becoming a Shopify developer.

Let's Build Something Together

Feel free to reach out if you're looking for a developer, have a question, or just want to connect.

Email:contact@iliashaddad.com

© Ilias Haddad 2021. All rights reserved.

Made with ❤️ in Morocco 🇲🇦