Create a multilingual site
With Sitejet, you can not only create sophisticated websites but also multilingual ones. You can either simply copy individual pages and translate the content or redesign the entire page. This article explains how to make multiple versions of your website available to visitors so that they can use the language they prefer.
Table of contents
Multilingual websites created with Sitejet recognize the browser language of website visitors and automatically show them the corresponding language if it is available. If your website doesn't have a version corresponding to the visitor's browser language available, the default language will be used. We suggest using English as the default language because it is more likely that visitors will understand the site content, even if their native language isn't available.
Set up multiple languages
To illustrate how to add a language to your site, we'll show you how to add a German version to an English website. Languages can be managed in the website settings. To activate multilanguage there, follow these steps:
- Click on "More" in the right corner of the top menu
- Select "Languages" to access the language settings
- Click in the field under "Multilanguage" and select "Enable multilanguage"
After you have activated multilanguage, you will see that the current default language is already listed. It is greyed out because it cannot be removed or changed. Move your mouse over it and a "+" symbol will pop up on the left side. Click it to add another language to the project.
Next, click in the empty field to select from a drop-down list of languages. In this case, we would select "German". Then click on the save icon in the menu bar in the upper left corner of the Website Builder (CMS) or use the key combination [Ctrl] + [S] to save the project. Then "German" will be grayed out and can no longer be changed.
Sitejet has now duplicated all previously created pages in the background and stored the necessary language information accordingly. Now, switch to the page manager of the respective language by clicking on the link button to the right of the language. For this example, we switch to the page manager for the German pages:
In the upper part of the view, you now have tabs to switch between the languages. In the "Name" area, you will find the ISO abbreviation for the respective language. In this case, it's "de" for German. After adding a new language, only the start page is activated, because there must always be a start page. The other pages can also be created by clicking on "Translate". If you want all subpages to be created by default when adding a new language you can change this setting by opening the burger menu in the top left corner, clicking "Preferences" and changing the "Language copy mode" to " Copy all pages".
Please note that changes to the pages that are made to one language do not affect the structure of the pages in other languages.
You can also modify the SEO settings and other details separately for each page of each language, as described in our articles on SEO and navigation.
From now on, the respective pages will no longer be accessible via www.your-domain.com/subpage, but via www.your-domain.com/en/subpage or www.your-domain.com/de/subpage.
When copying pages, new IDs are assigned to all elements. Therefore, ensure sure that all animations work as desired on the new pages of the additional language. Note that a manual translation/adjustment of the texts and button descriptions is required.
Allow visitors to select a language on your site
As we mentioned before, if a variant of your website which corresponds to a website visitor's browser language is available, the visitor will be directed there automatically. However, you may want to allow your website visitors to decide which version of your website they would like to view. You can do this by adding the "Languages" preset to your site. Go to the "Features" category in the sidebar and drag and drop the "Languages" preset into your page.
When you click on the preset settings and go to "Language" you can select how the languages should be displayed:
You can choose between flags, country code, or text.
URLs and "hreflang"
Sitejet automatically places "hreflang" for all available languages of the currently accessed page, e.g. www.sitejet.io/en/templates, as follows:
<link rel="alternate" hreflang="en" href=" https://www.sitejet.io/en/templates"/>
"Hreflang" is also used in the language element to tell search engines which language the link leads to. All other links do not contain "hreflang", because in such cases they are always in the same language.
Canonical URLs express the actual URL under which the currently opened page can be reached if it should be accessible via several URLs (to avoid duplicate content) and actually has nothing to do with the languages.
If you want to deactivate multilanguage for a website you need to delete all other languages so that there is only one language available. Then you can select "Deactivate multilanguage".
Become a part of our Community!
Exchange ideas with other web designers about current developments, tips, and tricks and show your favorite sites. Get advice and talk to us about possible features you would like to see on Sitejet. You can join the Sitejetters community here.