Start by purchasing the Multilingual CMS WPML package. It contains WPML String Translation, WPML Media Translation, and the core WPML Multilingual CMS plugin – just what you need to translate the Crocoblock-built website. After you upload it to WordPress, complete the basic language setup.

WPML setup

Run the WPML Setup wizard. In the first step, pick the default and translation languages of the website. Besides that, you can create a custom language if needed.

The second step allows you to format the URL of the translated website and offers three options to choose from:

• different languages in directories;
• a different domain per language;
• language name added as a parameter.

At the third step, you are supposed to register WPML. Сlick on the “Get a key for this site” link if you haven’t done it yet. It will lead you to the WPML account, where you can register WPML on the website you need and generate a site key. 

After doing so, paste the received key into the Site key field.

Proceeding to the next step, you need to decide how you would like to translate the website. If you choose the “Translate Everything” option, the three drop-down options will appear. 

When choosing the “Translate Everything” mode, WPML will start translating content in the background. You can check the translation progress by heading to WPML > Translation Management or pushing the WPML logo in the toolbar. 

Or, if you select the “Review the translations before publishing” option from the drop-down, you will receive notifications either on the Translation Management screen or in the toolbar.

As the new content will be published or edited, it will be translated automatically.

However, if “Translate Some” is picked, other customizations are available. Select who will work on the website translation. 

If you haven’t defined all the needed translation roles while setting up WPML, you can do it in the WPML > Translation Management > Translators tab. Here, you need to choose who you would like to translate the web pages. Assign all roles right away or one at a time – just return to this page later. 

Note that you can switch between modes later by going to WPML > Settings.

The fifth step called Support lets you send theme and plugin data to WPML support. In this way, you will get compatibility alerts that will decrease the problems with website translating.

At the sixth Plugins step, install recommended plugins based on the website themes or skip if not interested.

The final step includes additional information that can help you customize the process even more. Click on the “Finish” button to complete the setup.

Afterward, go to the WPML > Settings tab and define the translation method: Classic or Advanced. Please note that we suggest using the Advanced Translation Editor for new content and the Classic one for old content. In this way, it won’t affect old translations.

After everything is done, let’s proceed to translate the JetEngine-generated content.

For starters, go to WPML > Settings. Scroll down to Taxonomies Translation and make the ones you need translatable. Press the “Save” button.

Now, follow the WPML > Taxonomy translation directory and choose the one to edit from the drop-down list. You can see exactly the content this taxonomy includes. To add a translation, press the “+” icon.

In the newly-appeared window, submit the necessary translations by hand. The slug will be generated automatically. Please keep in mind that if there are identical slugs on the website, the system will add a suffix like “-uk,” where “uk” is short for the second (third, fourth, etc.) language. Don’t forget to press the “Save” button every time you edit the taxonomy content.

Similarly to that, you can translate the generic taxonomy term. Just scroll down the page, press the “+” icon, and repeat the steps above.

Repeat the same process for every taxonomy you’ve set to be translated.

Proceed to the WPML > Settings page and find the Post Types Translation section. Make the custom post types translatable. Then click the “Save” button.

There are three options available for you here:

• Translatable – only show translated items. Tick this radio button to display on the frontend only those items you translated;
• Translatable – use translation if available or fallback to default language. This option will output the content translation if you’ve provided it, and the items with no active translations will be shown “as is;”
• Not translatable. That’s pretty much self-explanatory. 

Afterward, open the Post Types tab in the admin panel and you’ll see that a small “+” icon appeared next to post type titles. 

Press any and you’ll be redirected to the WPML Advanced Translation Editor window. Translate the whole section by yourself or use automatic translation. Don’t forget to confirm each row separately; otherwise, the bottom scale won’t let you quit until it is 100% full.

You can translate the Listing Items in the exact same way:

1. Make them translatable in the Post Types Translation section;
2. Go to JetEngine > Listings;
3. Open the desired Listing Item by clicking the “+” icon;
4. Enter the translation manually or automatically;
5. Press “Complete.”

So far, the Forms can be made translatable, but this setting doesn’t target the Form itself. In other words, if you go to WPML > Settings, scroll down to Post Types Translation, and activate the “Translatable” radio button in the Forms row, the WPML tool will be able to detect and translate only the Form’s title. And this is not what you want.

To translate any Form into the language of choice, you’ll have to follow the JetEngine > Forms directory and make a copy of the needed form. Click the “Duplicate” button, name the form accordingly, and proceed to edit it.

Now, translate every form field into the necessary language by changing just the Labels, nothing else. If you alter any other components, we do not guarantee proper functioning. Don’t forget to press the “Apply Changes” button each time you’ve translated the Label.

You can also translate both the Notification Types and Messages Settings sections. The procedure is the same – you submit the new content into the allowed text areas and do not change the core field values. 

Once done, click to Update the Form and proceed to the page where it’s placed. You’re going to substitute the default-language form with the translated one. Right-click the Form area and select the second-language form in the “Select form” drop-down list.

Afterward, publish/update the page and see its frontend view.

Last but not least, you need to translate the header and footer templates as they will always be present on the secondary-language website pages.

Firstly, go to WPML > Settings and scroll down to the Post Types Translation section. Find the Theme Parts row among all and set it to “Translatable.” Save the changes. 

Secondly, proceed to Crocoblock > JetPlugins Settings tab on the WordPress admin panel and open the JetThemeCore plugin settings. In the General Settings tab, there is a Prevent Pro locations registration toggle. It is inactive by default. Enable the toggle as it will prevent the header and footer templates from disappearing on the second-language site pages.

Thirdly, translate the corresponding header and footer templates into other site languages. To do so, follow the Crocoblock > Theme Builder pathway. Locate the needed template and press the “+” icon next.

Add the translations as you normally do for a regular page template in the Advanced Translation Editor. Once done, click the “Complete” button. Repeat the procedure for both header and footer templates.

Follow the WPML > WP Menus Sync pathway. Press the “Sync” button to create a secondary-language menu first. Confirm the action by clicking on the “Apply changes” button once you see it.

Once done, proceed to translate the menu strings. Below the “Sync” button, there is some additional information. The first point contains a link to the needed menu strings, so click on it. You will be taken to the String Translations WPML module. Add the missing translations one-by-one including links.

For example, the English URL slug looks like this: /properties/ocean-star-luxury-cottage/. And this is its Ukrainian countertype: /properties-uk/ocean-star-luxury-cottage/?lang=uk. 

As soon as you finish translating the menu strings, return to the WP Sync Menus tab. You will see that there are now secondary-language translations available. Press the “Sync” and “Apply changes” buttons once again to finalize the menu translation process.  

This is it. Check out the result on the front end. The header template is displayed correctly; plus, all the menu items appear in the needed secondary language.