How to translate your website in a few minutes

Phillip Stemann
4 min readJul 3, 2020

If you have a target group where more than one language is present, it’s always a good idea to translate your website. By translating your website you widen your presence in different languages. If you have your website in English you are of course very far already, but imagine countries like Germany or France, they are very proud countries where not all are very good at speaking English. This often results in them googling in their own language, which means your English website stands no chance.

The most tricky part of translating is not the technical aspect of it, it’s actually getting the translations. If you don’t have the resources in-house there are however services you can use where they will translate it for you. Services like Easytranslate.

I will dig into how you can get it set up on your website, I’ll dig into 3 different setups, if you have another setup then please leave a comment. I’ll try my best to help you out find the best solution for your needs.

General rules for translation

When you set up your translations, you have to choose whether you want to use subdomains, domains, subfolders or neither. This varies from purpose to purpose and business to business. When you want to translate your website you need to clear it for yourself, whether you will get more values of domains, subdomains, subfolders or neither. Let me dig into each one of them.

Subdomains: Subdomains is great if you want to keep everything under one domain, but still create some clarity for your visitors and yourself. However using subdomains, Google crawls them individually, this means that all of your SEO juice from your content will be separated and you have to build authority for each subdomain as was it a completely different website.

Domains: Using different domains for different languages are great if you want to differ a lot in the content and design of your website. If you only translate the text I do not recommend you using multiple domains as it’s expensive to maintain.

Subfolders: Subfolders are great because you keep all the content on the same domain. That means your domain authority will benefit all of your content even though it’s the same content. But because it’s in different languages, you benefit without having issues from Google. This is great if you want to keep everything under one domain.

Neither: If you have a customised app, maybe a SaaS app or similar. You want to keep everything as it is, and only change the language for the specific user. Google doesn’t crawl your SaaS app within, so there is nothing to worry about.

Translate your WordPress website

WordPress is the most used CMS system out there. Even though there are a ton of options, people just choose to use WordPress because it is so simple and easy to use. For you to add translations to your WordPress website, you need to add a plugin, set it up, then you are good to go. I will show you 2 plugins I recommend you use, but there are many options out there if you prefer another plugin.

WPML

WPML is a very extensive plugin, and you can really customise it down to your needs. It supports all methods mentioned earlier and much more. It integrates with all of your favourite plugins, and it’s easy to use even though the possibilities within are endless.

Polylang

Polylang is a free plugin that can take your translations very far. They update their plugin often and supports all the methods mentioned above.

Translate your Javascript Website

If you have a customised javascript web app, it’s not as easy, but you’ll get around it. Whether you’re using Vanilla Javascript, React, Vuejs or Angular, there is a library for you to use.

Vanilla javascript: You can do this extremely simple, and with minimal coding. Andreas Remdt has made an awesome guide you can follow step by step, and before you know it, you’ll have it done. You can read the guide on Medium here.

React: There are a ton of different options out there. The library I like to work with is react-i18next, it’s simple to use and get the job done.

VueJS: Depending on whether you’re using Nuxt.js or not Kazupon have made a great library for you to use. Its name Vue-18n and it’s easy to set up for you.

Angular: They have their own library you can use. It’s completely made for Angular down to every line of code, so this is my top choice.

Translate your PHP Web app

If you have a PHP website, which isn’t a CMS, but a custom-built PHP website. I recommend you using Gettext, it’s more or less the same idea they use in WordPress. You have a pot file which is your template file, this file you turn into a .po file for each language. After this you’ll be able to use an application like Poeditor, to easily translate your website. Again having a PHP web app, keep it on the same domain, don’t use subfolders as Google won’t crawl past a login page.

Conclusion

Even though it’s a brief overview of how to do it in different setups, I hope you got the idea of where to go from here with your website. I have given you different options depending on your setup, and I know the post isn’t covering all setups, as it’s impossible. But if your setup isn’t covered, then leave a comment and I’ll consider adding it to the post.
I used Vue-18n when I built Wastecontrols web app, it works like a dream.

If you’re having any issues setting it up or even getting started then feel free to reach out to me or leave a comment, I will get back to you.

What system is your website built in?

--

--

Phillip Stemann

I am a web developer with 10+ years of experience. I believe that every project existing in the digital world is a result of an idea and every idea has a cause.