Headless E-commerce: Multi language on Shopify Plus

How to efficiently Support Multiple Languages on Shopify Plus

Updated 30-03-2020

Outline:

Your online business is growing. You’re gaining traction in countries outside of your “home” market. You are determined to increase the conversion rate of international traffic to your e-commerce platform. You understand that tailoring your business to the local needs of your international clients is essential, and you know that consumers want to shop in their own language. There is only one challenge: your e-commerce platform does not offer the flexibility to efficiently offer a multi-language option out-of-the-box.

In this article, we will outline one of the most bespoke challenges encountered when scaling internationally using Shopify Plus: we will tell you our story about encountering this multi-language issue, the unsustainable “solutions”, and the way that we solved this challenge (among others) by separating the content management and, thus, translations, from Shopify Plus to a separate best-in-class Content Management System (CMS), Contentful

We’ve been exclusively building Shopify Plus stores for almost four years now. We started out by supporting small brands that were looking for a simple way to sell online in a single country, meaning that they would need a store that operates in only one language. In this case, Shopify Plus has proven to be a solid solution for our merchants looking to sell their products online. This is also one of the main reasons that Shopify Plus was able to scale so rapidly in the US.

Luckily, these merchants started growing their business over the last couple of years. As a result, their companies slowly started shifting their focuses, going from national selling brands to international selling brands. In most cases, this means moving from a 17-million consumer market (The Netherlands) to a +700-million consumer market (Europe) and later, even moving to a global market. As you can imagine, it’s a huge opportunity for merchants with a strong brand, strong products, and a great platform. Alternatively, Ask Phill collaborates with international brands, which have been joining our clientele over the last two years, either starting out their Direct-to-Consumer business or migrating from another platform, such as Magento, WooCommerce, or Salesforce Commerce Cloud to Shopify Plus

These two types of companies are in a different growth stage but definitely share the same ambition. They want to scale their businesses internationally in efficient, sustainable, and successful ways. Although these merchants have laid a solid foundation for their e-commerce platforms by choosing Shopify Plus, there is much room for improvement regarding sustainability and scalability.

 

The Multi-Language Challenge With Shopify Plus:

The main issue with Shopify Plus is that it lacks a specialized CMS with multi-language translation capabilities and advanced CMS modelling. But hey, we can’t blame Shopify. It’s quite hard to be the best in two “markets” at the same time (E-commerce Platforms and Content Management Systems), and clearly, Shopify Plus has chosen to be the best in offering a SaaS e-commerce platform.

To cater to international selling merchants, Shopify Plus offers the ability to open multiple Shopify Plus stores from a single subscription. This means that you pay Shopify the Shopify Plus fee of $2000 a month, and they provide you with up to 12 separate stores (instances) to serve separate markets (languages). But even if your business is not ready to move to Shopify Plus, you’re still able to open a second Shopify instance and translate your storefront.

Every Shopify Plus store backend can only manage one currency and one language. So, if you decide to start selling in The Netherlands (NL), Germany (DE), France (FR), and The United Kingdom (UK), you end up with four separate stores as displayed below. When opening a new storefront, you choose a single currency and a single language. Every time you want to add a new language/currency combination, you add an extra Shopify store. This makes 

 

Multi-language on Shopify Plus, how to translate your content in the traditional way.

Image 1: Traditional Setup for Shopify Plus Merchants Opening International Stores

 

At first glance, this doesn’t look like a big challenge, and it’s something you can overcome with some extra manpower. But imagine that you want to expand even further due to your company’s success, and you end up with four or more stores.

Looking at Image 1 (above), we will explain why this setup is not scalable and sustainable:

  1. Content management is 4x the workload of what it can be: Imagine that you must go into each individual store to change texts, images, campaigns, app settings, products, collections, and so on to translate the content. Of course, there are workarounds, tricks, and apps to ease the work a bit. But, in our opinion, these aren’t sustainable. Every time you add a new country, you increase your content management team’s workload.
  2. Customer information and account management are decentralised: In the example above, the stores displayed all hold their own order and customer information. The order placed by a client in the Dutch store isn’t visible in the German store and vice versa. Besides that, the account information of the Dutch client isn’t available in the German store. The result is that a client contacting your company’s helpdesk can’t be localised as efficiently as it should be. A Dutch client is also not able to log into the German store and review their account.
  3. The structure of your URLs is not optimised for SEO: Since your multi-language store exists of multiple stores instead of one translated store, you will have to work with subdomains. As a result, Google will index all your language stores separately, and your separated stores will build up their own domain authority. Usually, betting on multiple horses at the same time ensures the best result, but not in the case of domain authority. You need to focus on one domain to be viewed as the authority. When using the Shopify Plus setup as displayed above, your URLs will look something like: www.nl.yourbrand.com, www.de.yourbrand.com, www.fr.yourbrand.com, and www.uk.yourbrand.com, while you want your URL’s to look something like: www.yourbrand.com/nl, www.yourbrand.com/de, www.yourbrand.com/fr, and www.yourbrand.com/uk for best SEO practices.
  4. The consumer can pick their language and currency separately: Another drawback of the above setup is that it’s impossible to make a combination of a currency with a language. So, an English person living in Germany is not able to shop in English and pay in Euros. This will have a negative impact on the conversions for this segment of consumers.
  5. Every extra backend means an extra subscription for every app you use in your store: This means that adding an extra store results in higher costs for apps you are using. Besides the direct financial implication, it also affects the time you need to set up every app multiple times in all the separate backends.

 

The Unsustainable Solution for Multi-Language With Shopify Plus:

Before we move over to our solution to overcome the multi-language challenge in Shopify Plus, we will review some solutions offered regularly by Shopify or other agencies. If you want to go for a short-term solution, pick the option below. If you want to go for a scalable and sustainable solution, don’t do it. Since we do not support the solutions below, we’ll keep it short.

Translation apps offered in the Shopify app store: For us, this is a no-go. What the translation apps essentially do is create a “fake” layer of translations on top of your existing website. This layer is created by adding Javascript to the front-end of your platform, which results in a glitchy front-end with a much lower performance. Besides that, it also messes up your SEO scores. So translating your store with a translation app is a no go.

 

How We Solved the Multi-Language Challenge With Shopify Plus:

After talking to numerous clients, who all brought up the same challenge, we decided to take action at Ask Phill. We were not planning to sit and wait around any longer until this topic would be fixed by Shopify Plus itself since we had already been waiting for over two years.

At the end of 2018, we decided to bring our agency’s brightest minds together and sit down to come up with a solution to overcome the translation and multi-language issue with Shopify Plus. 

Our high-level research questions were: “How can we use Shopify Plus to power a sustainable, scalable, and successful global e-commerce platform tailored to local needs?” 

The solution seemed simple, but the opposite was true. We invested more than seven months (and are still optimizing) to further crystallise our headless Shopify Plus solution.

Multi-language Shopify Plus, how to translate your store efficiently.

Image 2: Envisioned setup for Shopify Plus store to power a sustainable, scalable, and successful global e-commerce platform tailored to local needs.

As indicated previously, we believe that companies can only be the best in one thing; otherwise, they’re stuck in the middle. In the case of Shopify Plus, this means that companies are the best in building a solid SaaS e-commerce solution; the CMS is merely a nice-to-have to offer their merchants. For simple e-commerce stores, the Shopify CMS will do; for more demanding merchants, it will not.

With the current trend of Direct-to-Consumer e-commerce and brands willing to open their Digital Flagship Store and to provide an immersive digital experience to their consumers, merchants are in need of a more robust and flexible CMS to accompany their powerful e-commerce system, not only to cater for efficient multi-language functionalities, but also to be able to handle “next-gen” image formats like WebP, heavy content like high-definition videos and images, 360-degree images, and AR models without a hassle.

Therefore, we decided to develop a headless e-commerce solution to decouple the visible front-end from the e-commerce backend and to manage the translations on a separate front-end instead of having them integrated into the backend. For more in-depth information on headless commerce, please read our blog here

Essentially, this means that we are using two specialized systems to create the best of both worlds. We use Shopify Plus for e-commerce and Contentful CMS for managing content. The simplified overview of our setup looks like the diagram below. Depending on your business, this diagram can be adjusted according to your needs.

The Headless Shopify Plus setup of Ask Phill in combination with Contentful CMS. Better translating in Shopify.

Image 3: Headless Shopify Plus Solution in Combination With Contentful CMS

For your understanding, we point out what each system does what in the current setup:

Shopify Plus:

  1. Manages orders
  2. Manages customers
  3. Manages basic product information (price, SKU, barcode, image for checkout)
  4. Manages checkout process
  5. Connects with external apps and integrations

Contentful CMS:

  1. Manages textual contents per “locale”, thus translations
  2. Manages the structure of the website
  3. Manages the URL structure
  4. Manages images
  5. Manages videos

There will be one Contentful CMS login to manage all content for every national store, and there will be a separate Shopify store per currency (until Shopify fully supports multi-currency). By creating this setup, we have been able to solve the previously-indicated challenges of our clients below.

  1. Content management can be done from one system (Contentful) for all languages.
  2. Customer information and account management are all stored in one Shopify Plus instance because we do not need separate stores for separate languages.
  3. The structure of your URLs is optimized for SEO since we can set our own URL structure and use one domain instead of subdomains. With www.yourbrand.com/nl, www.yourbrand.com/de, www.yourbrand.com/fr, and www.yourbrand.com/uk, we can optimise platforms for SEO.
  4. The consumer can pick their language and currency separately. We have a setup where the language and currency are not connected; that’s why both can be selected independently.
  5. Since you only run one Shopify store per currency, you do not need to pay multiple times for the same app. You also save time since you only must set up the apps in only one store.

 

To Conclude:

Looking at the results above, we are confident to say that a headless Shopify Plus platform, in combination with Contentful CMS, is the only scalable and sustainable way to go multi-language on Shopify Plus. If you have found a better solution to this issue, we are curious to hear about it!

We have solved the multi-language issue for Shopify Plus, but it’s good to understand that our Shopify Plus headless e-commerce solution has more perks. With this solution, we can increase the platform performance, the flexibility of the platform, create a true digital flagship store, and further tailor a global store to local needs besides language.

If you would like to determine whether a headless Shopify Plus solution is what your company needs, please reach out to phill@askphill.com or fill in our enquiry form here.

Have a project in mind?

Let's connect