Liquid Toolkit

Examples

Liquid Localization

Building a Localized Theme

Liquid localization enables multilingual Shopify themes with t filter.

Introduction to Liquid Localization

Liquid localization in Shopify allows developers to create multilingual Shopify themes by using the t filter. This is essential for stores that cater to a diverse, global audience. By employing Liquid's translation features, you can ensure that your Shopify store communicates effectively in multiple languages, enhancing the user experience and making the store more accessible.

Using the t Filter for Translations

The t filter is a powerful tool in Liquid that helps in rendering translations. It works by mapping translation keys to their respective translations defined in the locale files of your Shopify theme. This allows you to easily switch the language of your theme without altering the core structure of your Liquid files.

In the example above, 'general.greeting' is a translation key. The t filter looks up this key in the current locale's translation file and outputs the corresponding translation.

Creating and Managing Locale Files

Locale files are YAML files that store translation keys and their corresponding translations. These files are typically located in the locales directory of your Shopify theme. Each file represents a language and is named using the language code, such as en.default.json for English or fr.default.json for French.

The above JSON snippet shows a simple locale file for English. You can create similar files for other languages, ensuring that the translation keys remain consistent across different locale files.

Switching Between Languages

Switching between languages in a Shopify theme can be done by changing the active locale. This is usually managed through the theme's settings or a language switcher implemented via JavaScript. When the active locale changes, the t filter automatically uses the corresponding locale file for translations.

Best Practices for Liquid Localization

  • Consistent Keys: Keep your translation keys consistent across all locale files to ensure smooth switching and uniform translations.
  • Clear Naming: Use clear and descriptive names for translation keys to make managing translations easier.
  • Testing: Regularly test your translations in different locales to ensure accuracy and functionality.

Examples

Next
Ajax Cart