This tutorial is kindly provided by the plugin developer.This is a complex but very well documented plugin. Due to the huge size of the documentation this is a general guide that links to the relevant information. Please check this link for more detailed documentation: https://wpml.org/documentation/
How to build multilingual sites with Beaver Builder and WPML:
How to translate the Global Rows / Templates (Header Text Area, Top Bar, Footer)
1. Translate the Header Text Area - "Get a Quote" button
You can add a multilingual versions of the button in
WPML > String Translation (so you have to enable the String translation Add-on) > see the screenshot below:
2. Translate Top Bar and Footer templates
Please note, that the most important requirement to work the translation for templates and saved rows is each language version to have the same slug (see the screenshot below 2.2.)!
So, you have to do the following
2.1. To connect the translation of the template or the saved row - don't add a new template / row, but translate the existing using the "+" icon for "Add translation to German/Spanish, etc."
If you don't see the "+" icons, please open whichever row / template and select the "Make templates translatable" option:
You can duplicate the content (there's an option in the right-hand block), then select the "Translate independent" option and you'll have the same page layout. Next, you can simply translate the texts to the language you need.
Please watch the attached video!
2.2. To have the same slug for both languages. If the "Slug" field is hidden by default, you can enable it in the screen options https://www.awesomescreenshot.com/image/3738963/fb0638f2851e33e5473529a831c4eaab. Next, you can manually add the same ID for each row / template: https://www.awesomescreenshot.com/image/3739018/f3bb08820395619ed00441f37fdfeb93
WPML consists of several modules. The basic module turns WordPress sites multilingual. Other modules help with an enhanced translation process, string translation, media translation and other functions.
You can learn about the different modules in the WPML Core and Addons page.
After you enable WPML, you’ll see a Multilingual Widget in the Admin Dashboard. This widget provides access to the different functions in WPML. You can also access them through the WPML menu.
- Languages – Determine the site’s languages and control how different language contents are organized.
- Theme and plugins localization – Choose between the traditional .mo files or using WPML’s String Translation.
- Navigation – Control the appearance of site-wide navigation based on WordPress pages.
- Sticky links – This is an essential function for running full websites with WordPress. It guarantees that links between pages can never break.
Translating Site Content
WPML creates different posts, pages and custom types for translations and connects them together. This means that every page has its own title, body and meta-fields.
WPML offers two ways for translating content:
- Manually, by clicking on the + icons
- Using WPML’s Translation Management module
Most WordPress sites contain texts outside of posts. WPML translates these texts using the String Translation module.
To display image galleries in translated content, you should use WPML Media. It will allow you to connect the same media files to content in different languages.
Once you’ve translated the site’s content and general strings, you might be interested in translating the site’s navigation and using localized permalinks.
Learn more about:
- Translating widgets
- Translating menus – create different menus for each language
- Translating page slugs – translate the entire URLs of custom post types
WPML missing translated outputs
If some strings appear in translations, but the output is still the original string, not the translated one and you've activated a child theme, please check if you have a wpml-config.xml file in both original and child theme folders. Next delete the one in child theme and it'll resolve the issue.