FROM CACHE - en_header

Determine the current locale from JavaScript (ScriptTag)

lsapan
Shopify Partner
3 0 2
‎07-05-2019 11:21 AM

Hello,

 

We're trying to update our app (which is completely loaded via a ScriptTag, no liquid templating required) to support multiple locales on Shopify. The problem is, we can't seem to find any reference to the current locale on the site. I checked the Shopify window object, but it's seemingly absent.

 

How can we detect the current locale that Shopify is using? I suppose we could fall back to navigator.language, but I want to make sure we're using the same language that Shopify actively is.

 

Thanks!

2,834 Views
Report
Replies 6 (6)
XGen
Shopify Partner
1 0 0
‎12-30-2019 06:02 PM

I have the same issue. Any ideas?

2,632 Views
0 Likes
Report
ilanush
Visitor
2 0 0
‎01-17-2021 01:21 PM

did you find a solution for this problem?

2,148 Views
0 Likes
Report
In response to ilanush
lsapan
Shopify Partner
3 0 2
‎01-17-2021 02:14 PM
Click to expand...
Unfortunately, no. We worked around it by just using the locale from the browser. It’s not perfect, but Shopify didn’t give us much of a choice.
2,140 Views
0 Likes
Report
In response to lsapan
ilanush
Visitor
2 0 0
‎01-18-2021 05:52 AM

Thank you.

There is another option that I have used maybe it can help you also: I have picked the selected language from the languages dropdown list and according to this i have manipulated the content by javascript.

2,116 Views
0 Likes
Report
AmalgaRabbitt
Visitor
1 0 0
‎04-09-2021 07:03 AM

I am not sure if something changed or not, but I have noticed that it can be daunting to find some JavaScript objects/methods.

Looking around I found a few ways that may help anyone trying to get the locale.

If you have any access to the Liquid templates you can inject and grab this from anywhere

{{ shop.locale }}

A common use case is (and most Shopify themes have had this from what I seen):

<html lang="{{ shop.locale }}">

Also looking around in the DOM (could not find it in my theme and I am assuming Shopify may be injecting this, but you can grab this script tag and grab that locale value)

<script id="shopify-features" type="application/json">{
"accessToken":"<token>",
"betas":[],
"domain":<domain>",
"predictiveSearch":true,
"shopId":ID,
"smart_payment_buttons_url":"<URL>",
"dynamic_checkout_cart_url":"<URL>",
"locale":"en"
}</script>

 
However the easiest way within Shopify and probably should have just lead with.. It is part of the Shopify global object.

Shopify.locale

AmalgaRabbitt_1-1617965655986.png

I did cross reference this with some other languages and it does give the nn-NN codes where multiple variations exist.

AmalgaRabbitt_2-1617965997590.png

AmalgaRabbitt_3-1617966026554.png

AmalgaRabbitt_4-1617966057926.png

For English adding the -** part would fall into the developers hands.

1,973 Views
0 Likes
Report
In response to AmalgaRabbitt
jam_chan
Shopify Partner
826 21 142
‎09-29-2021 05:10 AM

@AmalgaRabbitt 

Is this Shopify.locale a must-have object in js? I can't find it on one of my client stores

BYOB - Build Your Own Bundles, SPO - SEO App to research keywords & edit social link preview
1,602 Views
0 Likes
Report
Community Browser

Community Blog Articles

cropped-shutterstock_1498591895.webp
The 30-30-30 Rule: A Balanced Approach to Social Media for Startups

Explore the 30-30-30 rule, a dynamic social media strategy for new businesses. Learn how t...

By Trevor Sep 20, 2023
cropped-shutterstock_1913321758.webp
How To Gain Customer Trust With Your Store’s Footer

Discover how to leverage the often overlooked footer of your ecommerce site to gain custom...

By Skye Sep 15, 2023
shutterstock_2183225521_16x9.png
Who Are Shopify Partners?

In this blog, we’ll be shining a light on Shopify Partners, Experts, and Affiliates. Who a...

By Imogen Sep 13, 2023
Terms of Service Privacy Policy