Follow this tutorial to learn how to create multilingual WordPress sites using the Avada theme and WPML.
- Getting Started
- Selecting a Translation Mode
- Translating Pages Built Using the Avada Builder or Avada Live Editor
- Translating Avada Builder Global Elements, Columns, and Containers
- Translating Avada Layouts
- Translating Portfolio Categories and Custom Taxonomies
- Translating Avada Sliders
- Translating Avada Forms
- Translating Widgets and Texts from Avada Theme and Other Plugins
- Translating Avada’s Menus
- Setting Theme Options For Languages
- Translating Additional Avada Theme and Builder Elements
- Getting Help
- Known Issues
- Maintaining the Avada Builder Compatibility with WPML
- Need Help With Building and Maintaining Your Site?
Start by installing and activating the following:
- Avada theme
- WPML core plugin and WPML String Translation add-on
If you’re new to WPML, check out our Getting Started Guide. It quickly walks you through setting up and configuring WPML on your website.
With WPML’s Translate Everything mode, you can translate your site’s content automatically. This includes:
- Posts, pages, Portfolios, and other custom post types
- Portfolio Categories and other custom taxonomies
- Sliders and slides created with Avada Slider
- Global elements and layout sections
You can also automatically translate forms created with Avada Forms. However, you first need to send the forms for translation from the Translation Management dashboard. To learn more, see the section about translating Avada Forms.
Or, you can choose the Translate Some mode, which lets you choose which content you want to translate and who you want to translate it.
With WPML, you can easily translate pages you build using Avada Builder or Avada Live Editor. You translate them just like any other page or a post.
For detailed instructions, check out our page about translating content created using page builders.
Avada Builder allows you to save Elements, Columns, and Containers as global elements. Global elements are saved to your Avada Library, and you can insert them into any page you want. Updating a global item will update it everywhere it appears on your site.
For the global element to appear translated on your site’s front-end, you need to do two things:
- Translate the global element. You can do this the same way as translating pages or posts.
- Translate the pages that include the translated global element. When you translate the page, the text from the global element won’t appear in the Advanced Translation Editor. This is because you already translated in the previous step.
When you send global elements for translation to a local translator, make sure their WordPress role is set to Editor or a higher role. If you set their role to Author, Contributor, or Subscriber, they will not be able to see the sent global element in their translation queue. This is because Avada’s global elements can’t be created by those roles.
Once a global element is translated, you can insert it anywhere on your site. Just remember to translate the page or post you added it to for the translations to appear on the front-end, as explained in the previous section.
With layouts, you can design your header, page title bar, content, and footer sections. To translate these, follow the same process as translating the Avada Builder global elements.
If you want your layout section to only display under certain conditions, you may need these conditions to apply in all languages.
After translating your layout section, go to Avada → Layouts. In the admin bar language switcher, choose All Languages.
Then, set the conditions. Be sure to choose all translations of the post, category, or tag you want to use as a condition.
Portfolio categories can be translated the same as any other taxonomy.
Keep in mind that the translations of categories are universal. If you make any changes, they will be updated everywhere.
If you have a multilingual WooCommerce store, you may have some translated product categories, tags, or attributes. After completing the translations, you need to create the related variations of the products in other languages. To do this, go to WooCommerce Multilingual & Multicurrency. Then:
- Click on the corresponding taxonomy tab. For the purpose of this example, we’ll go to the Attributes tab.
- Using the dropdown menu, select one of your attributes.
- Click on the Synchronize attributes and update product variations button at the bottom of the page.
If you have more attributes, repeat the steps above for each of them.
If you are using the Translate Everything mode, your sliders and slides will be translated automatically.
When using the Translate Some mode, you first need to translate the slider created using Avada Slider:
- Go to WPML → Taxonomy Translations and use the drop-down menu to select Avada Sliders. A list of sliders appears.
- Locate the slider you would like to translate and click the plus icon for it. Translate your slider’s name and slug. Repeat this step for all of your sliders.
Once you have translated your slider, you can proceed to translating its slides:
- Go to Avada → Sliders and then click on the Slides Page link.
- To translate a specific slide, click the plus icon for it. This opens the Advanced Translation Editor, where you can add the translations. Repeat this step to translate all the slides belonging to a specific slider.
- Finally, translate the page where you have added the slider.
This is how the translated slider looks on the front-end:
The 7.1 version introduced Avada Forms, a complete solution for building your custom contact forms. WPML allows you to easily translate your Avada forms.
No matter if you are using the Translate Some or Translate Everything mode, you need to send your forms for translation. To do this:
- Go to WPML → Translation Management and select the forms you want to translate.
- Select the languages you want to translate the forms into and click on the Translate selected content button.
To translate the forms automatically, go to the Automatic Translation tab in Translation Management. Select your contact forms and click on the Translate automatically button.
To translate the forms by yourself, go to the WPML → Translations page, locate your form, and click to translate it.
To learn more, visit our documentation page about managing the translations of your content.
Besides content coming from posts and pages in your site, there are usually some additional texts coming from your theme and plugins.
Widgets are an example of these types of texts. You can translate them by yourself by going to WPML → String Translation:
- Using the In domain dropdown menu at the top of the page, select the domain of the strings you want to translate. In our case, it is Widgets.
- Once you locate the string you would like to translate, click the plus icon under the language you would like to translate it into.
If you are using the Translate Everything mode, you need to send the strings for automatic translation. To do this, check the boxes next to the strings you want to translate and select the languages you want to translate them into. Then, click on the Translate button.
Note: If you have a site with multiple translators, you will see an Add to translate basket button instead of a Translate one.
To learn more about translating these texts, read our documentation page about translating strings.
With WPML, you can easily synchronize your menus across all your site’s languages. For more information, please check our page about translating menus.
With Avada, you have to set theme options for each language in your site. You can do it manually, or you can import existing settings.
If you want to use the same settings for all the languages on your website:
- Go to Avada → Options.
- Use the Language Switcher in the top admin bar and select All languages.
- Set your preferred theme options and save your changes.
All languages will now use the options that you have set. Any changes that you make will apply to all of your languages.
If you want to have different settings for each language, follow the steps below:
- Go to the Avada → Options page.
- Use the Language Switcher in the top admin bar and choose the language for which you want to set options.
- Set your theme options for that specific language and save your changes.
You can repeat these steps for all of the languages that you have on your site.
You can also export theme options that you are using in one language and import them to another. To do this:
- In the top admin bar, use the language switcher to choose the language from which you want to export the settings.
- Go to the Avada → Options page and in the menu, click Import / Export.
- In the Export Options section click the Copy Data button and copy the text with the settings.
- Now, use the language switcher in the top admin bar to choose the language for which you want to import the settings.
- In the Import Options section, click the Import Contents from File button and paste the text with settings.
- Click the Import button.
You can repeat steps 4 to 6 for each language that you want to use those same settings.
Some Avada Theme and builder elements may not be available for translation by default.
If you can’t see the text you want to translate, start by checking if you have the latest wpml-config.xml file downloaded and installed.
This file includes the information WPML needs to know what to translate. The language configuration file is also used to configure elements like custom fields, admin texts, and page builder shortcodes. For Avada, we host the language configuration file on our servers.
If your wpml-config.xml is up-to-date, you may need to add translation support for the Avada elements.
WPML allows you to manually enable the translation of additional Avada Theme and Builder elements along with their attributes.
Enabling the translation of elements and element attributes listed in this section might cause issues when sending a page to professional services or using the Advanced Translation Editor to translate it. The issue is not technical but comes from the fact that translators often do not understand code and can break it during translation.
To translate any textual element in any of these shortcodes, you must add them to the Custom XML Configuration tab found on the WPML → Settings page.
Let’s consider an example of a Person element which includes texts that require translation. In this case, you would add the following code on the Custom XML Configuration page.
<wpml-config> <shortcode> <tag>fusion_person</tag> <attributes> <attribute>picture</attribute> <attribute>social links</attribute> </attributes> </shortcode> </wpml-config>
The following is the list of all shortcodes you can add manually, along with their attributes:
- Portfolio (fusion_portfolio) | Attributes: cat_slug, exclude_cats
- Post Slider (fusion_postslider) | Attributes: excerpt, category
- Recent Posts (fusion_recent_posts) | Attributes: cat_slug, exclude_cats
- Column (fusion_builder_column) | Attributes: background_image, link
- Container (fusion_builder_container) | Attributes: background_image, video_preview_image
- Content Boxes (fusion_content_box) | Attribute: image
- Countdown (fusion_countdown) | Attribute: background_image
- Faq (fusion_faq) | Attribute: featured_image
- Flip Box (fusion_flip_boxes) | Attribute: image
- Image (fusion_image) | Attribute: image
- Image Frame (fusion_imageframe) | Attribute: lightbox_image
- Person (fusion_person) | Attributes: picture, social links
- Sharing (fusion_sharing) | Attribute: pinterest_image
- Testimonial (fusion_testimonial) | Attribute: image
- WooCommerce Carousel (fusion_products_slider) | Attribute: cat_slug
To learn more, see the page about defining page builder shortcodes in the language configuration file.
If you need help translating your site built using Avada and WPML, visit WPML’s support forum.
Current unresolved issues:
- Taxonomy meta data copies incorrectly or not at all
- Avada – Off-canvas elements aren’t translated on the front-end
- Avada – Mega Menu layout breaks when WPML language switcher is added as the first menu item
- Avada – Language switcher text shows multiple times in posts and pages
- Avada – WPML’s Classic Translation Editor displays the global shortcode
- Avada – Slider settings are not copied to translations
- Avada – “Read More” link label of post card is not showing translation
You can also search all known issues including previously resolved issues for this theme.
If you are a part of the Avada development team or a web developer using Avada, see the page about maintaining compatibility between Avada Builder and WPML.
If you need help with building or maintaining your site, take a look at the list of WPML Contractors. They are experienced developers specialized in developing multilingual sites.
Don’t have WPML yet? You can test WPML for 30 days and see if you like it.
If you are not happy with our plugin, we refund you without any questions in the 30 days.