The Multilingual Tools plugin is a testing plugin you can use when registering custom Elementor widgets for translation. The plugin includes a WPML – Config Generator for Elementor that automatically generates the first version of XML code for these custom widgets.
Using this tool, you’ll be able to get the information you need to register your widget.
This guide is for developers who build Elementor themes and plugins and want to make them compatible with WPML. If you’re not a developer, check out our guide on How to Translate an Elementor Website with WPML instead.
Make sure you have the WPML Multilingual CMS core plugin and WPML String Translation add-on installed and activated on your site.
Ensure you already have some content created with Elementor on your site.
How It Works
When you create a page using the Elementor page builder, all the content gets saved in the _elementor_data custom field.
Once you add the custom widgets you want to register for translation to a page, WPML – Config Generator for Elementor accesses this _elementor_data field to read its contents. After reading, it converts the data into XML code that corresponds to the custom widgets you’ve used on your page.
Generating XML code with the WPML — Config Generator
To automatically generate XML code for your custom widgets:
Create a new page and click on Edit with Elementor.
Add the custom widgets you want to register for translation to the page.
Important: When adding your widget to make it translatable, be sure to fill in all fields and enable all available options.
This is because WPML – Config Generator for Elementor doesn’t generate XML code for any unconfigured field or option.
Publish the page and return to the WordPress edit screen for that page. Scroll down to the section labeled WPML: Elementor Widgets. You will see the generated XML code for the widget fields and settings that are not registered for translation yet.
Testing the Automatically Generated XML Code
Before making the code available to end users, make sure to thoroughly review and test it. WPML – Config Generator for Elementor is only a starting point.
To test the automatically generated XML code:
Copy the XML code from the section labeled WPML: Elementor Widgets on the WordPress edit screen of your page with the custom widgets.
Go to WPML → Settings and click on the Custom XML Configuration tab.
Paste the code into the editor and press the Save button. Check that you don’t see any warnings or validation errors. Make sure to remove any fields that shouldn’t be translated or modified by users, such as configuration fields and fields with boolean values. Leaving these fields available for translation can cause issues and errors for end users.
Go back to the edit screen of the page with the custom widgets. Make a small change to the page, such as editing the page title, and click Update.
From the Language box, click on the plus icon to translate the page. The Advanced Translation Editor opens and you should see the registered fields from the custom widget available for translation. Review the automatic translations or input your own and click Complete when you’re done.
Take a look at the translated page on the front-end to make sure the custom widget fields appear correctly.
Using Additional Inspection Features
Besides automatically generating the XML code for your custom Elementor widgets, WPML – Config Generator for Elementor provides additional debug information.
This information allows you to inspect and understand the underlying data and how it’s being used. It may be useful in specific cases, such as when the XML code does not work as expected.
WPML Config XML (generated for all widgets in the page)
What it does: Provides the XML code for all the widgets on the page, including those already registered for translation.
Why it’s useful: Allows you to review or edit the XML code of existing widget settings.
RAW value from _elementor_data (JSON)
What it does: Shows the original value of the _elementor_data field of the post.
Why it’s useful: Lets you see the data the WPML – Config Generator for Elementor Widgets uses to generate the XML code.
Array generated from _elementor_data
What it does: Provides the value of the _elementor_data field of the post, converted into an array.
Why it’s useful: You can use the array for debugging purposes.
Extracted Widgets from _elementor_data
What it does: Shows which custom widgets the plugin was able to extract and use from the _elementor_data field.
Why it’s useful: If you do not see custom widget, custom widget field, or custom widget option here, it will not be added to the XML. This is useful for debugging.