Translate your Elementor WordPress website with ease with this state of the art Multilingual plugin. This website also contains a WooCommerce webshop, so we will be translating that also.
?????? Start here ??????

I want you to succeed with your website, so lets get started.

⏱️Timestamps⏱️
0:00 Translate Elementor – Intro
0:45 Get WPML ➜ https://wpressdoctor.com/wpml/
2:36 Installing and setting up WPML
7:19 Translate pages
11:49 Translate menu
13:05 Change the Permalinks
13:48 Change the Dropdown width ➜ .wpml-ls-item .sub-menu { width: 60px; }
14:16 Translate WooCommerce products
16:42 A word from the Doctor – Outtro

✅For tips and tricks on getting the most out of WordPress, don’t forget to subscribe: https://wpressdoctor.com/sub

Translate Elementor – Multilangual WordPress Site With WPML

?Transscript?

O hi there! The next patient is MEXAustria. They provide outdoor sports in of course, Austria, and the symptoms are that they’re German and English visitors don’t understand the Dutch website. No of course they don’t understand their Dutch website! Alright so what do we need to do? The doctor prescribes a two step medicine. The first step is we will install world’s best translator that will work seamlessly with Elementor. And the second step is we will translate all the pages and products of WooCommerce because that’s also installed on their website. Alright come on, I’ll show you how to do this, so you can do it also at home, let’s go.

If you already have WPML installed on your WordPress website, you can skip this step. If you follow this link, you will not pay any more, but you will help me out because I will receive a small fee if you register with WPML. Go to WPressDoctor.com/WPML/ Press enter. And here we are at the WPML website. Press ‘Buy and download’. And what you’re looking for with Elementor is that we have ‘Page Builder support’ so we need a multilingual CMS version, or a multilingual agency. Well if you’re not a agency then you should probably use the multilingual CMS version. And with this version also comes that you can install it on three websites for one year, and after that year you have to renew your license or just wait until things break and then you can update again. All right, we press ‘Buy Now’. Fill in your details. And please the order. Once you have paid you can log in to your WPML account. You will come right here, and you click on this ‘Downloads’ button right here. And we’re going to download the WPML CMS. Click on the download button and it starts downloading automatically. We will be needing some other packages, but we’ll be downloading it straight from within WordPress. So after we’ve download all the files, we go to ‘Go to your list of sites’. And we press here ‘Add new site’. Fill in the URL of your website and press the button ‘add’. Copy this key because we will need it later.

Login to your WordPress dashboard. If you’re still using /wp-admin/ to login -That’s not a very safe way so please watch this video about “WordPress Security – The Circle of Five”. Go to ‘Plugins’ -> ‘Add new’ and choose ‘Upload Plugin’. Press browse and select the plugin we just downloaded from WPML and press ‘Install now’. Press ‘Activate plugin’. And let’s press ‘Configure WPML’. Now we choose the language current used on your website. The current language used on MEXAustria is Dutch, so we press ‘Next’. And here you can choose all the languages which you want to translate your website to. We want to translate this website to German, and to English. You can always add more languages later, just select languages that you have your translation for right now. Press ‘Next’. Let’s add a ‘Menu language switcher’ right now. We choose the ‘Main menu’. And we want the position to be at the last menu item. Why is that? Because people just change the language one time, so it isn’t logical that it would be on the first menu item. So press ‘Last menu item’. I’m gonna use a drop down -I like that. And I want to have a flag. And I don’t want to have the names in the language. All right. The color theme, it can be ‘Clear all colors’, because we’re going to do that later on. Press ‘Safe’. And you can scroll down. I don’t want a widget. And I don’t want a link to translation of different posts. If you want that, you can still change this later on. Press ‘Next’. We want to send theme and plugin information so that WPML can update their plugin, even more to make it more compatible with all the things we are using. Press ‘Next’. Here we paste the site key that we just copied from the WPML website, and we press ‘Rgister’. We have a thank you message, and we press ‘Next’. Now these are the recommendation of WPML components that we should use. We want the ‘String translation’ ‘Translation management’ ‘Media translation’, and also we’re using WooCommerce on this website. So we’ll be using that, and a Contact Form 7. So press ‘Install and activate selected plugins’. And after that, we can press ‘Finish’. So now it askes to help us with the WooCommerce shop. So press ‘Let’s continue’. We need the store pages for English and German. Those are the pages for your checkout for example, and your cart. So let’s create the missing translations and press ‘Continue’. We don’t have any attributes so we press ‘Continue’ again. We don’t want multiple currencies because we don’t have a international webshop, because all people that are coming to the MEXAustria, they are coming for outdoor sports so we won’t be selling overseas for like example products or services that you can rent, and we do it in your country. So if you do have a webshop with products that you sell to another country like Euro or America with our currencies, you should enable this one. If you don’t -like us-, just press ‘Continue’. We don’t want this we press ‘No’ because other people can’t really read products right now in the other languages. Press Continue. And let’s press ‘Close Setup’. “The WPML Media translation setup is almost complete, click here to finish the setup”. Let’s finish the media translation setup. Press ‘Finish setup’. Once the setup is complete, we will see here all the media that we are using in this website. So here you can change all the images to the different languages. We will doing that later on. Let’s go to the all the options of WPML. Press ‘WPML’, press ‘Languages’, and we’re got a notice from WPML: “One more step before you can translate Elementor”. ‘Enable it now’. And its done, so we can close this message. “Learn how to use e-commerce site multilingual” -I will learn you, so you can close this message also. All right, all the settings of WPML has been set correctly. If we need to change something, we will go to it later on.

Let’s start translating. We go to ‘Pages -> ‘All pages’. And let’s go to our front page and add those to another language. Here’s the front page. As you can see there is a plus sign that says ‘Add this translation to English” and “Add it to German”. Alright let’s add our first translation and press ‘Add translation to English’. So this is the page that you see right now. You see on the left side you see your original language -We have a Dutch language right here, and you have your translation to English. So you see the first one is the title. The title is ‘home’. When you have translated it, press this button: ‘Translation is complete’. As you can see on the lower side of your screen, you’ll see how much, what the percentages of the page is being completed. So that’s why we need to check this box. As you can see, these are the custom fields. Those are the SEO fields of RankMath. The RankMath title, the RankMath description and the RankMath focus keyword. If you don’t have a SEO plugin on your website, please watch my video about the RankMath Tutorial so you will be helped out, because your website deserves to be found. Let’s translate all the RankMath SEO options. And remember, don’t forget to check the boxes. So in some cases you will see here that you have the editor right here on the right side. Then you know that there has to be some kind of markup added to your website. As you can see, we have the paragraph and the break HTML goes right here. So to be absolutely sure that you don’t break your layout of your website, press this little button right here ‘Copy from original’. It will copy straight one on one all these HTML codes that are very important for your current layout. Once you have copied it, you can just replace it with the English text right here. So just to do it again, we press the ‘Copy from original’ text and you can see different layouts, different codes. You select what you want to translate, you translate it step by step, so you don’t mess up your current layout. Just one more time, because repetition makes you learn everything, Press this button, go to your text and change your text by keeping all these HTML intact. Alright, so once we have translated the text we go to media. And here you see titles and alt text, those are very important for your international SEO. So just translate them the way you translate your text. All right, once you’ve translated the entire page you will see that 100% is complete, so you can press ‘Save and Close’. Now once you have saved and closes, you will see on your front page, you will see something has changed. It’s not a plus sign anymore, it is a pencil so you can always edit it, once you have changed something in your front page. Alright let’s see on the front page how it works. We go to the site, we open it in a private window. And once it is loaded, we will see that there is a drop down right now for English. Now let’s press this flag and see what happens. All the text has been correctly translated. That is awesome. You will notice two things that didn’t translate. It is the menu, it is still in Dutch, and the footer is also still in Dutch. Also, you will see that the drop down menu is way too big, we will be fixing this later on in this video. You just translated your homepage. Now let’s add the German language, press this sign next to the pencil. You can dismiss this message right now. And here you can see this same page but now we have the original on the left side Dutch, and now we have German on the right side. All right, let’s enter all the fields. And once again I’m going to tell you: press this button ‘Copy from original’ and then you translate it. And once you have translated the entire page you press again ‘Save and Close’. Alright let’s see in the front end if it works. We go to the website, we visit our website in a new private window. And let’s see if the German translation is here. Yes it is! We press it and we see if everything translates the right way. “Erlebe das Abenteuer mit MEXAustria!” Oh, that sounds awesome. Alright it’s great everything has been translated, except for the menu and the footer once again.

So before we can create our menu in different languages, we need to translate a couple of more pages. So go to your pages and translate every single page on your website. Good luck! So once you have translated all the pages and posts that you want to translate go to ‘Appearance’ and ‘Menus’ and here we going to create the menu in different languages. We have one Dutch menu. The name is ‘Hoofdmenu’, because that is Dutch. So let’s make a English version, press the ‘English’ button right here. Let’s call it the English name which is called ‘Main Menu’. This is a translation of ‘Hoofdmenu’ and press ‘Create menu’. Now you can fill your menu the same way you’re used to. Except that you only see here the pages that are translated. If you miss any pages, go back and check if they are translated for 100%. So let’s create our menu with of course the home. And once your menu is created, we press ‘Save Menu’. And then we’ll check at the front end, if everything works. As you can see we now have a translated menu on top with all the pages we just translated for our website.

There is also one thing I want to change. This is -you can see the permalink is /?lang=EN. I want to change the permalinks for SEO purposes, to make it different. Let’s go to ‘WPML’ -> ‘Languages’, and we’re going to change this one, “Different languages in different directories” we press ‘Save’. “You may need to re-save the site permalinks” so click on this button and press ‘Save Changes’. Let’s get back to ‘WPML’-> ‘Languages’. And let’s edit the ‘Menu language switcher”. Now we want to change the order of language. Dutch, the English, German, right here.

While we are here we can also change the big box. I mean this huge menu. We’re going to change it with a little CSS. And you just paste this CSS right here. It is in the description of this video, so you can always find it. Press ‘Save’. Our settings are saved,let’s see if it works. And after refresh as you can see, the menu is nice and neat and small. That’s awesome. That’s the way we would like it.

So now we’ll be going to translate the WooCommerce products. Go to ‘WooCommerce’ -> ‘WooCommerce multilingual’. Here you can see all products to translate. Before we start translating products, let’s first translate categories. Go to ‘Categories’ and translate this the same way as you would translate pages. Press the plus button and translate your category. Once you’ve translated all the categories you will see that the exclamation mark will be removed from this menu. If it doesn’t, well, you might have more items than fits on this page. So press this little button right here, so you can translate the other categories. Let’s go to ‘Tags’ and translate also the tags. We quickly gonna translate all these tags. And once you have translated all the tags, you can go to ‘products’. Now when we start translating all the products inside of your WooCommerce webshop, just press the plus button -as you would have guessed. And here we have exactly the same as the pages and posts. You have just on the left the original language, and the other language on your right side. So once you have translated the entire product to your other language, you can see that the custom product attributes can be copied right here. And when you’re done you just press ‘Save and Close’. Now we’re going to check if everything works. Open link in a new private screen. We can see we have the Dutch version right here and we switched to the English version. Now you see that this is all translated Private lesson, number of people, choose your options, number of days, clear. All right, so the final thing to show is how to translate this footer. Well, every footer and every theme is different, but they created their footer as a menu, which we can easily translate now. We go to ‘Appearance’ -> ‘Menus’. And we ‘Select a menu to edit:’ the footer menu. ‘Select’ and we add a English translation, we give it a name, and we press ‘Create menu’. Once you’ve entered all links you press the Save Menu. We’re going to see on the front end if it works the way we want it. And we see now that footer links are also fully translated and going to the right pages in English.

Well done! You’ve just made your website multilingual! I am proud of you. Now it’s time that we get that website found by Google. So follow this video about SEO, and if you’re not sure if your security is alright, then follow this video and I will walk you through all the security tips that I have. Have a awesome day.