How To Create a Multilingual Website With WordPress – Step by Step Guide

The Gutenberg editor brings major changes to how you create content. Fortunately, building a multilingual website is just as easy as it was in previous WordPress versions thanks to the WordPress language plugin WPML.

WordPress Gutenberg works seamlessly with themes such as Astra to allow you to build your content using separate blocks just like other well-known page builders.

The best part of combining it with WPML’s Advanced Translation Editor and its new auto-translation feature is that you can translate your pages without having to create new designs each time you add a new language.

With Gutenberg, Astra and WPML you design your pages once and only once!

We’re going to cover how to build a multilingual website using WPML, Gutenberg, Toolset and Astra.

It’s a powerful combination that can deliver an awesome website in no time, regardless of your skill level.

Why Translate Your Web Content?

The primary reason to translate website content is to expand your audience. There are lots of benefits to consider though, including:

Multilingual SEO

SEO is probably one of the main reasons you’re looking at translating your website content.

You need to use every trick in the book to outperform the competition and get your pages ranked.

Search engine optimization isn’t just for English. Every word and every keyword combination in every language has its own SEO opportunities.

The more languages you offer, the more individual SEO opportunities you’ll be able to take advantage of.

If your main area of operation is the US, an American English site will rank for that market. But what if you also compete in Mexico or India? What if a good portion of your audience come from elsewhere in the world?

Here’s an example of how multilingual SEO can help.

According to Google Trends, one of the most popular search terms at the time of writing is ‘cupcake’.

If you build a good quality blog post around cupcakes, you stand a good chance of ranking for that trending keyword.

But cupcake in Spanish isn’t cupcake, it’s ‘magdalena’.

So, the estimated 500 million Spanish speakers out there won’t necessarily be searching for cupcake but for magdalena.

Producing a good quality blog post on cupcakes and then translating it into Spanish allows you to compete for both cupcakes and magdalena.

That’s an extra potential audience of half a billion people!

Widen Your Audience Reach

According to Babbel, of the 7.8 billion people on earth, only 1.35 billion of them speak English.

While that’s still a lot, it’s only a portion of the global audience.

If you operate internationally and want to do business on the global stage, a translated website is essential.

Not only will your brand be more respected for providing local language versions, you’ll also begin building trust.

Managed well, that trust will turn into custom and then into loyalty.

Keep Up With or Outperform the Competition

If your competitors provide a multilingual web experience, so should you. If your competitors don’t provide one, it’s a golden opportunity to outperform them.

Having a multilingual website when your competition also has one reduces their advantage over you. It also helps you compete on a more level playing field.

If your competition doesn’t have a multilingual website, it’s your turn to have the advantage.

Either way, you should use every trick in the book to keep up with or outperform your competitors. Offering multiple languages on your website is a simple, achievable way to do that.

Help Build Global Presence

It doesn’t matter how large or small your business is, you’re operating in a global marketplace. The more professional and inclusive you appear, the more authority you’ll attract.

Having a multilingual website shows you understand and appreciate your customers. At the end of the day, customers just want to feel respected, listened to and understood.

Providing web content in their native language goes a long way to satisfying all those needs.

It also helps build the idea that your website is more about your customers than you, which is never a bad thing!

Build a Stronger Brand

All the preceding benefits combine to help you build a much stronger brand with an international presence.

You’ll compete well with other companies, perform better in SEO and find it much easier to be viewed as a professional in your field.

Your customers will feel appreciated and listened to and should return that gesture with higher conversions and more trust and loyalty.

All things any web-based business can benefit from!

Astra Theme for Multilingual Website

Astra is fully compatible with Gutenberg, as well as major drag and drop page builders. So, no matter what builder you want to use, Astra should work seamlessly.

Astra is lightweight and designed for performance. The end result is a page that takes less than half a second to load.

Now that’s fast!

Building Your Site Quickly With Astra

Astra has been designed to deliver awesome websites with minimal time and effort.

It is compatible with drag and drop page builders like Elementor, Beaver Builder and others but is also fully compatible with WordPress Gutenberg.

The same team behind Astra also provides the powerful Spectra. That’s how committed to it we are!

If you want to launch a website but don’t know how to code, you’ll find using Astra refreshingly simple.

Here’s how to build a website quickly with the Astra WordPress theme. We’re assuming you already have WordPress installed.

We’re assuming you already have WordPress installed. If you don’t, check out this complete guide to installing WordPress.

Log into WordPress.

Select Plugins and Add New from the WordPress dashboard.

Type ‘astra’ into the search box at the top right.

Install and then Activate the Astra Starter Templates plugin.

Select Appearance and Starter Templates from the dashboard menu.

Select your page builder of choice from the top right of the Starter Template screen.

Search or browse for a theme to import.

Select the theme and a new screen will open.

Select to upload a logo or skip and continue.

Follow the intelligent template import process until your site is ready.

Setting up your new website using Astra should take less than five minutes. You’ll probably spend longer selecting from the amazing themes than you will importing them!

Once installed, you can navigate to Pages or Posts in the same way you would with any other theme.

Installing the WPML Plugin

Next, we’ll need to install the WPML plugin to begin building the multilingual part of your website.

If you have installed plugins before, this part will look slightly different. You cannot search and install WPML from the plugin dashboard. You have to download from the WPML website and upload it instead.

1. Set up an account and purchase WPML from their website
2. Select the Downloads section within your account dashboard
3. Download the latest version of the OTGS Installer to your computer
4. Select Plugins and Add New within the WordPress dashboard
5. Select the Upload Plugin option
6. Select the OTGS Installer file you downloaded
7. Select Install Now and then Activate
8. Select the Register WPML link at the top right of the plugin screen and register it with your WPML account
9. Select the relevant components to install from within the WPML window and select Download at the bottom of the page
10. Follow the WMPL setup wizard that appears and configure for your specific languages

There are a few steps to installing and activating WPML on your website but it’s all very straightforward.

Once done, you’ll be presented with a setup wizard that will walk you through the process of setup.

WPML has created an excellent instructional video that walks you through translating your website using Astra and WPML. Check it out!

Introducing WPML

WPML, The WordPress Multilingual Plugin, is an intelligent plugin capable of automatically translating an entire website.

You can translate pages, posts, navigation and anything on the page.

If you have an international team supporting the website, you can even translate the WordPress dashboard and everything in it too!

WPML installs like any other WordPress plugin and opens up a world of international languages, 40 languages to be exact.

Translating Website Content With WPML

WPML offers three main ways to translate your content. This leaves you to choose whatever works before for you.

Those translation methods are:

• Automatic translation
• Automatic translation with manual editing
• Manual translation

Automatic Translation

Automatic translation is provided by WPML’s Advanced Translation Editor. This is a very powerful feature that takes your original content and can automatically translate it into your language(s) of choice.

It’s no more difficult than using Google Translate, only it’s a lot more accurate!

Translations are of a high enough quality to be able to be published with confidence and portray your business in a positive way.

Automatic Translation With Manual Editing

You can also combine automatic translation using WPML’s Advanced Translation Editor with manual editing if you like.

Each translated page has the option for you to edit manually with a native speaker to check accuracy.

This is an extra check to reassure you that the translated content is accurate and doesn’t inadvertently say the wrong thing!

Manual Translation

If you don’t want to use the automatic translation method, you are still free to have your content translated any way you like and manually add it to your website.

WPML works with professional translators who can provide your content or you can provide your own content.

Either way, you can upload and format your translated content quickly and easily within the translation window of WPML.

WPML’s Advanced Translation Editor Makes It Simple to Translate Your Content

WPML’s improved Advanced Translation Editor adds a number of important features which will dramatically reduce the amount of time it takes to properly translate your website.

Not only is translating your content easier, but WPML ensures your new pages automatically use the same design as the master language, saving you even more time.

Here are the new features of Advanced Translation Editor:

You can translate content immediately using the “Translate automatically” option.

Automatic machine translation: All of your content can be translated with just a click of a button. Of course, you will need to go through it afterwards to ensure it is completely correct.

Clean text: Say goodbye to annoying shortcodes and HTML getting in the way of your translating. All you will see is clean text and nothing else on the Advanced Translation Editor.

Add repeat text: Advanced Translation Editor will recognize any repeated text and will automatically add the translation.

Glossary: You might have a lot of jargon which your translators may not understand. You can create a list of key terms which they can refer to as they work.

Spell-checker: You will no longer be plagued by basic errors. Just like on Word or Google Docs you will be able to instantly spot and correct any spelling mistakes.

How to Translate Your Content With WPML

Translating content with WPML could not be easier. Once you have built your website, added your website template and have everything looking fantastic, now it’s time to add translated content.

We have created a post called “The top 10 beaches to visit in France” in English using the Astra theme.

Here is how it looks on the WordPress back-end:

We now want to translate it into French.

Let’s go through the steps one at a time.

While we use French and English, the process is exactly the same whatever languages you’re working with.

Step 1: Enable French as a Language on Your Website

We first need to make sure that we have activated French as a language for our multilingual website.

If we head to WPML > Languages and look under Site Languages, we check the option next to French.

Save the change and you have added French as a second language.

You can add more if you wish, but for the purposes of this walkthrough, we’ll leave it there.

Step 2: Open the French Translation of the Post on Advanced Translation Editor

Next, we’ll translate our English post into French.

Open the post within WordPress.

You should see an option to create a French translation under Translate this document. Once we click on the plus icon, we will be taken to the Advanced Translation Editor.

This is where the magic happens!

Step 3: Automatically Translate Your Content

Before tools like the Advanced Translation Editor, we would have spent a lot of time and effort manually translating the English text into French.

Now, all we need to do is click Translate Automatically at the top of the screen and wait a couple of seconds.

Now we have all of our content translated into French!

Feel free to have that content checked by a native speaker. You should find that it’s a very accurate translation.

Step 4: Check Through the Translated Content

Even though we already have our French content, we shouldn’t bet our business on the accuracy of that content.

While we have complete confidence in it, we appreciate you’ll need reassurance if you’re representing your business using translated content.

Therefore, we need to go through it to make sure there are not any errors.

Read through the translated post, or have a native speaker do it for you.

You should find it error free, but if you want to make any changes, you can do that in the Advanced Translation Editor.

Simply change the content you want to change and click Finish.

This will save your changes and our content is ready to go with the same design as the English version.

We now have our French version with the exact same design as the English one.

How easy is that!

Manual Translation Using the WPML Plugin

As mentioned, you don’t need to use the Advanced Translation Editor to translate your content. You can do it manually if you prefer.

If you have native speakers on staff or would prefer to reword content so it works better in another language, that’s easy.

Here’s how.

1. Open the page or post you want to translate
2. Select Language from the right sidebar and toggle ‘Use WPML’s Translation Editor’ to off
3. Select ‘This Page’ in the popup window that appears
4. Check the box next to the desired language in the Duplicate part of the Language box from the menu on the right
5. Select the pencil icon under the Duplicate section to show the page you want to translate
6. Select Translate Independently to prevent WMPL overwriting the page with automatic updates
7. Manually add your translated content to the blog post editor as you would normally
8. Select Update when done to save the page

Now select the page from the front end of your website, choose the appropriate language and you should see your manually translated content.

Rinse and repeat for every page or post you want to convert into other languages!

We have just seen how we can translate a WordPress post into another language.

But what if we need other content sections which we want to translate? What if you want to take your blog or website much further?

That’s where Toolset comes in.

Add Toolset to Build Advanced Features With Gutenberg

If you want to add professional elements to your multilingual website then Toolset is the perfect plugin.

You can use Toolset to build advanced features including custom post types, taxonomies and custom search. The best part is that you will not need to know any code to build them!

Toolset is completely integrated with the other tools you will use to build your website. It is built by the team which brought you WPML.

In addition, it supports custom types, Astra and Gutenberg.

In fact, Toolset adds a number of additional blocks to Gutenberg to provide even more functionality to your website.

One of these is the content template block which allows you to add the same template for each of your post types.

Easily add the same template for each of your post types using Toolset.

Translating Related Content With Toolset and WPML

One way Toolset can help with websites is by creating post relationships. This is a way to link content, author or something else within posts.

If you run an online store for example, post relationships link different products together so they can be searched for or linked within a post.

If you run a business website and use custom post types, you can link those types together using any criteria you like.

For example, a post type of movies and another of actors can be linked using related content.

As an actor is likely to appear in multiple movies, rather than adding their bio to every single movie review, you can add the related content marker and refer to a single bio for every review.

You can also translate this content in the same way you as any other content.

This page on the Toolset website has a full explanation of related content and how to translate it.

Multilingual Website FAQs

We hope this article has answered the majority of questions you have around multilingual websites. In case we haven’t, here are a few more popular questions we often see on the topic.

Build a Multilingual Website With WPML and Astra

So that’s how to build a multilingual website with Gutenberg, WPML and Astra. We said it was easy!

We covered the what and the why of translating websites. We then walked you through every step of setting up the Astra WordPress theme and translating a page into French.

We also showed you how to translate automatically and manually, so you know exactly how everything works.

Now it’s your turn. Tell us what you think.

Have you already used WPML, Gutenberg and Astra together to create a multilingual website? Have you tried to create additional advanced features using Toolset? Let us know in the comments below!