Skip Navigation
Home » Documentation » A List of Multilingual-Ready Themes, Compatible with WPML » How To Translate Pages Built with X Theme (Cornerstone Builder)

How To Translate Pages Built with X Theme (Cornerstone Builder)

Mohamed Khafaja
Updated
October 11, 2021

X Theme includes the Cornerstone page builder. WPML allows you to conveniently translate pages built with Cornerstone. You will design once with Cornerstone and translate just the texts with WPML.

Cornerstone Page in original language

translation of cornerstone with WPML

Cornerstone Page translated to Italian

translation of cornerstone with WPML

Contents

Getting Started

Start by installing and activating the following:

  • X 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 all the translation options you can use.

Translating Your Pages

There are multiple ways to translate your content with WPML. The easiest one is to enable the Translate Everything mode and let WPML translate all your content automatically as you add or edit it. Translating your pages built with Cornerstone.

You can also use WPML’s Translation Management page and send content to be translated by others.

And of course, you can translate pages yourself. Visit our documentation page for exact steps on how to translate content build with page builders.

Watch a short overview of translating pages built with Cornerstone in the following video. Please note that from the WPML 4.0 version and newer, the option to activate the translation editor is on the WPML → Settings page.

Translating Portfolio Pages and Categories

To translate Portfolio items or any custom post type items, you need to follow the same steps as for translating any other types of pages.

You can translate Portfolio Categories while translating your pages, on the translation editor screen.

Additionally, you can translate your Portfolio Categories on the WPML → Taxonomy Translation page. Select the Portfolio Categories from the drop-down menu and a list of your categories will appear. Click the plus icon to translate a category for the respective language and use the dialog box that appears to add your translation.

Translate the categories using the Taxonomy Translation page

Keep in mind that the translations of categories are universal: if you make a change, they will be updated everywhere.

Translating Texts From X Theme, Plugins and Other Places

Besides content coming from posts and pages on your site, there are usually some texts coming from other places. The most common examples are themes and plugins.

To learn how to translate these texts, read our documentation page about translating these texts manually or sending them to others for translation.

Adding Translation Support for Cornerstone Elements

WPML allows you to manually enable the translation of additional X Theme/Cornerstone elements.

Enabling the translation of the following elements might cause issues when sending a page to professional services or using Translation Editor locally to translate it. The issue is not technical but stems from the fact that translators often do not understand the 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 Classic Code Snippet element that includes texts that require translation. In this case, you would add the following code on the Custom XML Configuration page.

Example - Classic Code Element 
<wpml-config>
  <shortcodes>
    <shortcode>
      <tag>x_code</tag>
    </shortcode>
  </shortcodes>
</wpml-config>

The following is the list of all shortcodes you can add manually, along with their attributes:

  • Audio (x_audio_player, x_audio_embed) | Attributes: mp3, oga
  • Classic Clear (x_clear)
  • Classic Code Snippet (x_code)
  • Counter (x_code) | Attributes: num_start, num_end, num_speed, num_color
  • DropCap (x_dropcap)
  • Gap (x_gap)
  • Line (line)
  • Map (x_map)
  • Classic Google Map (x_google_map)
  • Classic Promo (x_promo) | Attribute: image
  • Classic Protect (x_protect)
  • Classic Recent Posts (x_recent_posts) | Attribute: category
  • Classic Pricing Table (cs_pricing_table_column) | Attribute: price
  • Video (x_video_player) | Attributes: m4v, ogv, posterc
  • Classic Raw Content (x_raw_content)
  • Classic Skill Bar (x_skill_bar) | Attribute: percent

You can find more information on the page about defining page builder shortcodes in the language configuration file.

Translating Content Coming From Cornerstone Add-ons

X Theme ecosystem is wide and it features many useful add-ons that extend its usability. We are constantly working on making these add-ons translatable with WPML but not all of them are yet integrated.

In case you use an X Theme add-on that’s not yet configured to work with WPML, you can fix it yourself. Follow the instructions on integrating page builders that use shortcodes with WPML. You will tell WPML which shortcodes include texts, making it all work together.

Translating Sliders

X Theme comes bundled with the Slider Revolution plugin. For detailed information, check out the page about creating multilingual sliders using Slider Revolution.

Translating Sidebars

X Theme allows you to create sidebars that you can display on specific pages, posts, tag archives, or category archive pages.

Start by creating the page in the default language and translating it.

Now, to create a sidebar and make sure it appears on the page in all languages, follow these steps:

  1. Set the admin bar language switcher to All languages.
  2. Create a new sidebar by navigating to Appearance → Sidebars. For more information, check out the X Theme documentation page on creating sidebars.
  3. Select both the default language pages and the secondary language pages where you want the sidebar to be displayed.
  4. Click the Update Sidebar button.
Selecting the default language and secondary language pages

Finally, add widgets to the sidebar that you have created and translate the widgets’ content.

Translating Menus

WPML allows you to easily synchronize between your language’s menus. We recommend that you see our full documentation explaining how to translate a menu.

Known Issues

Currently, there is an issue with translating the old, classic (legacy) Cornerstone elements using any of WPML’s translation editors. As a workaround, you should be able to translate the classic elements manually.

Getting Help From Our Support

In case you need help translating your site built using X Theme and WPML, visit WPML’s support forum.

Get WPML

You can evaluate WPML for 30 days and see how you like it. If you are not happy with our plugin, we refund you without any questions in the 30 days.

Buy and Download