How to translate Zerif (or any other translation-ready theme)

In this documentation, we use Zerif as an example. Zerif is translation ready in order to fulfill our customer's needs from all around the world. With Zerif you can easily have your website in any language you need.

Translate using Polylang

Plugins such as Polylang, WPML are great if you want to create a multilingual website. You can use any of these plugins. For this tutorial, we are going to use Polylang

1. Installation: The first step is to install the plugin(How to install WordPress Plugins). Once the plugin is installed you need to activate it. After activation, go to Installed Plugins -> Polylang -> Settings. The Settings section will give you access to choose the language(s) you need for your website. Add and prioritize the languages here.

2. Homepage: Choose the default language for the pages you would like to translate and make a duplicate of the page for the other language option:

3. String and post Translation: After this, you can start translating the strings on your website. 

  • Customizer Strings: To translate the options in Customizer, first, make sure that you have saved your own content and not having theme's sample content. Then go to Languages -> Strings Translation where you will find your strings in order for you to enter your own translation.
  • Language Switcher in Menu: After you've translated your strings according to your preferences, make sure to enable the language switcher in the menu:

  • Dynamic Strings: Another way is to use POEdit to create your own .po and .mo files from Zerif's .pot file with your translations and place them into Languages folder. Make sure you use the right names for these files to match the language you need. For example, for Romanian, you would have ro_RO.po and ro_RO.mo.
  • Widgets: To translate the widgets you just need to create separate widgets for each language and you will get a button with the following text "The widget is displayed for:" and just select the language.
  • Posts & Pages: To translate posts and pages follow this:  https://polylang.wordpress.com/documentation/setting-up-a-wordpress-multilingual-site-with-polylang/translating-posts-or-pages/

For further details, please check  Polylang documentations.


Are you using a child theme?

In this case, you need to take an extra step.

Please copy the file called wpml-config.xml from your parent theme's folder into the child theme's folder. Open it and change the line:

 <key name='theme_mods_zerif-pro'>
OR
 <key name='theme_mods_zerif-lite'>

 (For Zerif PRO or Zerif Lite)

to:

 <key name='theme_mods_child_theme_example'>

where you need to replace child_theme_example with your child theme's folder name.

After this step, you should be able to translate the strings using Languages->Strings Translation.

Important notice: When using a child theme, in order for the translation to work you need to check if this Group field (from Languages->Strings Translation)  is matching your child theme folder name, like in our example child_theme_example.

If instead of the child theme's folder name, Group is showing the name of the parent theme's folder (like, in this case, zerif-lite) as in the below image, it means that all the strings were translated from the parent theme, not the child theme.

In this case, you need to activate your child theme (if not activated yet), go to Appearance -> Customize and once again change all the strings (even a little change, like a blank space that can be after that removed) and save the changes. After this, you will see the new strings in Polylang->Strings Translation and be able to add the translations for each of the strings.


Another way is to use Loco Translate plugin

  1. Install Loco Translate plugin by following this guide -> How to install WordPress Plugins
  2. Go to Loco Translate then in the list of themes find the desired theme name. And click on + New Language
  3. Select the language from the list or just enter "en_US" in the small field and click "Start Translating". Let's assume that you have chosen "en_US".
  4. Now you will see a list of words. You can either scroll to find your word to translate or use the "Filter translation" search option and type in the word you are looking for. Once you select your word enter it's translation in the "Translation" field.
  5. Click on "Save"
  6. Click on "Sync".
  7. Then go to Settings > General under "Site Language" option to select the language.

When you go back to Loco Translate to do more translations just click on the language you are editing.

That's all! Your multilingual website is ready to go!