Using liquid objects in javascript ( Eg. shop.name )

Highlighted
Shopify Partner
6 0 9

Hi ,

I am building a shopify app and loading a script using scripttag. I am trying to retrieve liquid objects like customer id , shop name etc. in my script as -

var id = {{ customer.id | json }} ;

var shop_name = {{ shop.name | json }} ;

It returns unexpected token ' { ' error.

Could you please let me know how should I go about retrieving liquid objects in my script so that I can use them in making api calls ?

Would appreciate your help. Thanks in advance!

Regards,

Jinesh

4 Likes
Highlighted
Shopify Partner
4 0 0

Jinesh did you ever find an answer for this?

0 Likes
Highlighted
Shopify Partner
6 0 9

Hey Christiaan,

Yea I did find a solution to it. So the thing is you can extract liquid objects in javascript with a js.liquid extension. So load a script with js.liquid asking for the required paramters and then use them in your main script file as you would use as any other js variable . Hope it helps! 

Regards

Jinesh

0 Likes
Highlighted
Shopify Partner
4 0 0

Sorry, but what do you mean 'load a script with js.liquid'. Do you mean pass the variables into your script with liquid?

https://help.shopify.com/api/reference/scripttag

 

0 Likes
Highlighted
Shopify Partner
6 0 9

Nope. Use the asset api to upload a js.liquid script file. This js.liquid would contain the js vars which you need like var shop_name = ' {{ shop.name }} ' ; etc. 

asset = shopify.Asset()
asset.key = "snippets/{{ some_script }}.js.liquid"
asset.src = "{{ actual path of script on your server }}"
asset.save()

And then access the variables like shop_name etc. in your main script which you load using scripttag.

Hope it helps!

Regards

Jinesh Shah

1 Like
Highlighted
Shopify Partner
4 0 0

Ah yeah, makes sense. Thanks!

0 Likes
Highlighted
New Member
2 0 0

Hi Jinesh, I am completely new to this process.. would appreciate a little guidance.. you wrote this code in the app you created, and then how exactly did you access the variables in your javascript code, which you are probably hosting somewhere else.. :( 

0 Likes
Highlighted
Shopify Expert
9925 103 1763

^ There seems to be a lack of understanding on how JavaScript works. When you add a script file into your document it has access to the variables in the Document. If the variable created like the example is global then any script you load can access it directly

★ Winning Partner of the Build a Business competition. ★ http://freakdesign.com.au
0 Likes
Highlighted
New Member
2 0 0

Indeed Jason, thank you :)

0 Likes
Highlighted

will this work with variant.inventory_quantity?

-Like and Mark as an Accepted Solution if my reply is helpful
I'm not an expert, these are my own experiences or codes that I gathered from others. I'm using Debut.
I have my own online pet supply store check it out at
PETLANTIS.CA
0 Likes