This guide will help you to create a multilanguage website with Moto CMS 3 template. This can be achieved by creating multiple pages with text in different languages and then connecting them altogether. In order to achieve this goal please follow these steps:
1) First you will need to open your home page and duplicate it. This copy will become key page for your other pages in the same language. It will be used as home page for your website in another language.
2) Then you will need to change your Page Name for the one you like(it can be anything you want). Also you will need to change your Page URL. It is recommended to use abbreviation of language that will be used on this page(for example you can use fr for French language). This Page URL will play important role in all your pages of the same language. It will be displayed in your URL as indicator of language that is currently displayed on your website. For example it will look like this link www.domain.com/fr/subpage_url. As you can see your French page URL is displayed before actual page link so user can see what language is currently displayed.
3) Next you will need to open "Design" tab of your page properties and duplicate your header and footer. As headers and footers are used on multiple pages by using this advice you will separate your main language header and footer from translation so by editing one of them in won't affect another language version.
4) Now once your Home page preparation is complete you can start translation of your page content with your footer and header.
Please note that in this new header you will need to create new menu widget with new buttons and click actions for them so it will open pages in another language instead of original ones.
5) Once your home page is created and translated you can start duplication of your other pages. This will create base markup for your page in another language so you will just need to replace a text in it.
6) For these pages you will need to create new Page Name and Page URL. For these pages you can set up any name and URL you want. Additionally for these pages you will need set up a Parent Page setting. You will need to set your Home page of your language version that you were setting up from 1-st to 4-th step as Parent Page. This step will add URL of your home page you have specified in step 2 to the URL of your page. So your link will look like www.domain.com/fr/subpage_url.
7) Next you will need to open "Design" tab of your page properties and select Header and Footer you have created in step 3 for your Home page of this language version. This action will transfer your header and footer from Home page so you won't need to translate them again. Also this header will contain new menu widget you have created for your language version.
8) Now you can translate content of your page to another language.
9) You can translate as many secondary pages as you want just by repeating steps from 5 till 8.
10) Now once all your language pages are created you will need to modify your menu widget on your Home page for your language version so buttons there will open pages you have translated. This will allow you to browse your language version separately from you main website.
11) By repeating steps from 1 till 10 you can create another language versions of your website.
12) Now when all your template pages are translated you can create multiple buttons that will redirect your visitors to home pages of your language versions where they can start browsing your website in another language. As all your pages are using the same header these buttons will lead to home pages of your language versions so by switching language you will open home page of another language instead of opening the same page. In order to make these buttons open the same page in another language you will need to create separate header for each page and in each of them you will need to use different click action for these language buttons to open specific page in another language.
In the end you Moto CMS control panel will display all your pages in 1 list but your visitor will see them as separate language versions because they can only be switched by buttons in your header.
SEO optimization.
This part of the guide will help you to optimize your language versions for SEO. This will prevent Google from recognizing your pages as duplicates of the same page.
Firs of all you will need to create special code for your pages. You will need to create separate code for different pages as this code will only be shared between same pages in different languages. It will be based on following code:
<link rel="alternate" hreflang="en" href="http://www.motocms.com/website-templates/"/> <link rel="alternate" hreflang="fr" href="http://www.motocms.com/fr/website-templates/"/> <link rel="alternate" hreflang="de" href="http://www.motocms.com/de/website-templates/"/> <link rel="alternate" hreflang="x-default" href="http://www.motocms.com/website-templates/"/>
You will need to modify this code in the following way.
First you will need to change all hreflang="en" parts of the code to languages you are using in your website. Please do not change the hreflang="x-default".
Then you will need to add links to your pages in href="http://www.motocms.com/de/website-templates/" part of the code by replacing the sample link with links to your pages.
Following part of the code defines what language version is main language of your website so link to page in this code should be replaced by link to page in your main language
<link rel="alternate" hreflang="x-default"
href="http://www.motocms.com/website-templates/"/>
After all your modifications all bold text below should be replaced by your language abbreviations and links to your page in different languages.
<link rel="alternate" hreflang="en" href="http://www.motocms.com/website-templates/"/> <link rel="alternate" hreflang="fr" href="http://www.motocms.com/fr/website-templates/"/> <link rel="alternate" hreflang="de" href="http://www.motocms.com/de/website-templates/"/> <link rel="alternate" hreflang="x-default" href="http://www.motocms.com/website-templates/"/>
Once you have created the code you will need to add it to all language versions of your page in Header text field under "Code Injection" tab.
Once this code is added to all your page translations you will need to create another code for your other pages and add it in the same way.
Comments