Shopify locale aware URLs

Stephen Keable
3 min readAug 3, 2022

If you are using the Shopify Markets functionality to make your store available to multiple currencies or languages. You are likely using locale aware URLs, which add something like this to your URLs:-

yourdomain.com/ <- Without locale
yourdomain.com/en-gb/ <- With locale

When using these you need to ensure that you avoid hardcoded URLs within your theme, to avoid accidentally bouncing a customer to the wrong locale, where they might get the wrong language or currency.

In Theme Code

When having your developer check through your theme to remove hardcoded URLs to things like the cart or account pages then the Routes object is their friend. Allowing them to change them like this:-

<a href="/cart">Cart</a> <- Bad
<a href="{{ routes.cart_url }}">Cart</a> <- Good: /en-gb/cart

On pages like collections where you have links to product pages, you are likely using the product object to create the URL, which will retain the current locale. Similarly with other instances where you are using the .url property of an object. So no changes needed there.

{{ product.url }} Outputs: /en-gb/products/your-product

However in your theme you might have a hardcoded URL to a page like a shipping information page, which you will need to change like this:-

<a href="/pages/shipping-info"> <- Before
<a href="{{ pages['shipping-info'].url }}"> <- After

--

--

Stephen Keable
Stephen Keable

Written by Stephen Keable

Shopify partner, JavaScript/Liquid/Swift developer, convert to serverless architecture and builder of digital products people love to use since 1999.

Responses (1)