There are some notable limitations to Translate & Adapt, though. In some cases, translating your content may require you to edit your Shopify theme’s Liquid code.
Below, we’ll go over absolutely everything you need to know about Shopify Liquid translation.
Personalize your Shopify storefrontShogun enables brands to show customized versions of pages to defined visitor segments.Get started now
Setting Up New Languages on Your Shopify Store
Before we get into the limitations of Translate & Adapt (as well as how to work around them), let’s review what this app can do for your store.
If you would like to add a new language, this can be done through the Shopify control panel:
Log into your Shopify account and select the “Settings” option in the left sidebar of the main dashboard.
Select the “Languages” option.
Select “Add language”.
Use the dropdown menu to choose which language you want to add, then select “Next”.
Choose which Shopify Markets you would like to assign the language to, then select “Done”.
Once you’ve added a new language, the Translate & Adapt app will automatically be installed on your store.
Translate & Adapt can be used to automatically translate up to two languages — these automatic translations are provided by the Google Cloud Translation API.
You can also use Translate & Adapt to manually translate your Shopify store into as many languages as you want:
Select the “Apps” option in the left sidebar of the main Shopify dashboard.
This will open a popup window containing a list of all your installed apps — select “Translate & Adapt”.
Use the “Localized content:” dropdown menu to select the language you want to translate your store into.
Select the resource you want to translate (you can choose from product pages, blog posts, metaobjects, and many other aspects of your store).
Once you’ve selected a resource, you’ll see your content written in its default language displayed side-by-side with empty fields where you can put your translations in. For example, opening a product page in Translate & Adapt will allow you to add translations for the title, description, URL handle, etc.
For many merchants, this process is all that’s required to translate your Shopify store.
But if you have previously added custom features to your Shopify store by editing its Liquid code, you will likely find that these features are nowhere to be found in Translate & Adapt. In order to get them to show up, you’ll need to make some further edits to your Shopify theme.
Translating Custom Content with Shopify Liquid
There are two areas of the Shopify Liquid templating language that you’ll need to become familiar with in order to make your custom-coded features available in Translate & Adapt:
Locale files: These JSON files contain translations for text strings used throughout your theme.
Translation keys and filters: Translation keys are objects used where text would appear on your storefront, while the translation filter (typically referred to as just the character “t” when writing Liquid code) accesses and outputs the translation of a key.
When a translation key is passed through a translation filter, the corresponding value is pulled from the appropriate locale file.
To access your locale files:
In the left sidebar of the main Shopify dashboard, select the sales channel that you would like to customize.
Open the “…” dropdown menu located next to your theme.
Select “Edit code”.
You’ll find the “locales” folder located at the bottom of the left sidebar of the code editor.
The names of locale files must follow IETF language tag nomenclature — the first letter code is in lowercase and represents the language (e.g., “en” for English), and the second letter code is in uppercase and represents the region (e.g., “US” for the United States or “GB” for Great Britain). If your translation isn’t region-specific, you can just use the first lowercase letter code for the language.
There are two types of locale files:
Storefront locale files: These files have a .json extension and control the translations of your storefront content.
Schema locale files: These files have a .schema.json extension and control the translations of content found within the theme editor settings.
In other words, storefront locale files are the only option here that affects how visitors see your site.
Within the locale files, all of the translations must adhere to the following organizational structure:
Category: The top-level category for the type of content you’re translating.
Group: The second-level group of translations within a category.
Description: The actual translations for individual pieces of content.
For instance, the English translations for a 404 page look like this:
It should also be noted that you will not be able to include more than 3,400 translations in a single locale file, and each translation value in these files has a maximum limit of 1,000 characters.
Case study: PUULAB
To demonstrate how this all works together, let’s take a look at a real-world example — after custom-coding a feature for their privacy policy agreement, the Shopify brand PUULAB discovered that the language for this feature was not listed in the Translate & Adapt app.
To make this content show up in Translate & Adapt so that they could add their translations, they first inserted the following code into the footer.liquid file of their theme:
<!-- Manually added code START -->
<p>
<br>
<font size="2">
{{ 'layout.newsletter_agreement' | t }}
<u><a href="https://puulab.com/pages/privacy-notice">{{ 'layout.privacy_policy' | t }}</a></u>.
</font>
</p>
<!-- Manually added code END -->
Notice the use of translation keys (“layout.newsletter_agreement” and “layout.privcy_policy”) and the translation filter (“t”).
Then, PUULAB navigated to the appropriate spot in their English locale file and added the following lines:
"newsletter_agreement": "By subscribing to our newsletter, you agree to",
"privacy_policy": "our privacy policy",
After that, they were able to access their custom content in Translate & Adapt.
Personalize your Shopify storefrontShogun enables brands to show customized versions of pages to defined visitor segments.Get started now
Using Shogun to Translate Content on your Shopify Storefront
If you’d prefer not to mess with your Shopify theme code, you can use Shogun’s personalization capabilities to translate any of the content on your store instead.
In fact, Shogun offers AI tools that make it especially easy to translate a large amount of text. Merchants with significant translation needs can save countless hours with this feature, giving you more time to address all the other tasks that go into running your store successfully.
With Shogun’s new Shopify Importer feature, you can import literally any Shopify 2.0 theme page into Shogun:
After downloading and installing Shogun, log into your Shopify account and select the “Apps” option in the left sidebar of the main dashboard.
Open Shogun.
In the “Pages” section of the app, you’ll see tabs for “Shogun pages” and “Shopify pages” — select “Shopify pages”.
This will display all of the pages you’ve created on your Shopify 2.0 theme. To import any of these pages into Shogun, simply click on the “Import page” button.
Once the pages you want to translate have been imported, the next step is to create an audience segment for the locations you’re targeting:
Select the “Personalization” option in the left sidebar of the main Shogun dashboard.
Select “Segments”.
Click on the “Create segment” button located near the top-right corner of the page.
For the conditions of this segment, add all the areas you receive a significant amount of traffic from that primarily speak the language you’re translating your content into. For example, if you would like to translate your content into French, you could add a segment that includes France, Quebec, and the French-speaking countries of Africa.
Save your changes and create the segment.
And once your Shopify pages have been imported into Shogun and your audience segment is ready, the final step is to use Shogun’s visual editor to add your translations:
Go to the “Pages” section of the main Shogun dashboard and select the page you would like to add translations to.
This will open Shogun’s visual editor. Now, click on the “Personalization” button located near the top-right corner of the page and select “Turn on personalization”.
Create a new variant of the page and assign it to the audience segment you just created for French-speaking visitors.
You’ll see that the visual editor now has tabs for the new variant as well as the original version of the page. Click on the tab for the new variant.
Select any piece of text that you would like to translate — this will open several customization options above the text, including a button for “Generate text with AI”.
Copy the content you need to translate, click on the “Generate text with AI” button, and then submit a prompt such as “Translate ‘[paste content here]’ into French”. It will only take a moment for your translation to be generated — if needed, you can manually make edits to the translation or hit “Generate” again to start over with a fresh output.
Whenever you’re done translating your content, save your changes and publish the page.
After you’ve completed this process, visitors who are located in French-speaking areas will automatically be directed to the variant of the page that has been translated into French, while everyone else will still see the original version.
And this is only one way that you could use Shogun to localize your storefront. Other options include:
Adding images of local landmarks to build more of a personal connection with visitors.
Customizing your written content to make any necessary adjustments for cultural context.
Adding a banner or other design element celebrating holidays or events that only apply to certain areas, such as a local holiday or a country collecting the most medals at the Olympics.
Promoting products in areas where visitors will most likely be interested in them while simultaneously promoting other items in areas where visitors will less likely be interested — this can help you improve the overall sales figures for each product.
Ensuring compliance with local regulations by removing any references or links to items that cannot be sold in certain areas.
There’s just no limit to what personalized experiences can do for your store.
Personalize your Shopify storefrontShogun enables brands to show customized versions of pages to defined visitor segments.Get started now
