Search code examples
localizationshopifyliquidshopify-template

Can I conditionally render elements of Liquid Shopify template depending on the localization Language?

Im updating a Shopify site to display in English and Japanese languages. I used the 'Translate and Adapt' Shopify app and have fixed up the questionable auto translations to a point where I'm mostly happy with them.

There is one problem. I have product-thumbnails that have a minimum price.

enter image description here

In English the format 'from ¥900' is fine but in Japanese I want it to display as '¥900 ~' so I'd want to conditionally change the display order of the products.general.from string variable and the price variable.

I've found the code in product-thumbnail.liquid that conditionally shows the value of products.general.from;

{% if product.price_varies and product.price_min > 0 %}
  <small><em>{{ 'products.general.from' | t }}</em></small>
{% endif %}

Inspecting the elements in Chrome shows that the lang and data-current-lang are set to 'ja'.

enter image description here

Is there a way to access the value of data-current-lang in the liquid template in order to conditionally render a different version of the code-block above if the language is set to 'ja'?

Solution

  • You can use the request object to get the current language code.

    {% if request.locale.iso_code == 'en' %}
 // English language.
{% elsif request.locale.iso_code == 'ja' %}
// Japanese language
{% endif %}