Multi-language field types

Three different field types are available as multi-language types:

  • Text
  • Markdown text
  • HTML

Each of these behave as described for their "single language" counterparts (see related articles below) but with an important difference as outlined here.

All content for the custom field (i.e. across languages) are stored in the same metafield, so it is important to specify which language you need. If you omit this, all languages will be shown

This example grabs the English (ISO code 'en') title from a custom field called "title":

{{ product.metafields.accentuate.title.en }}

Matching a language to the visitor's preference

But if we always wanted to show the title in English, there would be no need for multiple languages. 

We can match the custom field output to any Shopify translated content by using the language noted in the URL via shop.locale. For example, if you have myshopifystore.com/es/products/great-shirt, you can grab the es language and use it as a key to access your custom field snippet:

{{ product.metafields.accentuate.title[shop.locale] }}

We can also detect the visitor's browser language using a little Shopify magic to show the "title" custom field in the language preferred by the visitor:

{% assign user_language = request.locale.iso_code %}
{{ product.metafields.accentuate.title[user_language] }}

Showing a default value

The above examples will return an empty string if no content was provided for the visitor's language. To properly test if we have some content to show and revert to a safe default, we can apply the code below. 

This code also showcases that the configured locales (country names' ISO codes) are available in a special metafield shop.metafields.acf_settings.locales for precisely this purpose:

{% assign default_language = shop.metafields.acf_settings.locales | first %}

{% if product.metafields.accentuate.title[shop.locale] %}
  <p>{{ product.metafields.accentuate.title[shop.locale] }}</p>
{% else %}
  <p>{{ product.metafields.accentuate.title[default_language] }}</p>
{% endif %}

Multi-language Markdown example

In case you were wondering how multi-language Markdown fields work, here is an example (note the .html at the end to get the rendered HTML from the markdown code):

<p>{{ product.metafields.accentuate.markdown_title[shop.locale].html }}</p>
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us