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

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

For this, you can use any translation plugin like Polylang or WPML. For this tutorial, we are going to use Polylang

First step is to install the plugin. You can do that from your Dashboard->Plugins->Add New. After this process is over, you need to activate it. After activation please go into Polylang Settings. The Settings section will give you access to choose the language(s) you need for your website. (For further details, please check Polylang documentations.)

After this, you can start translating your website. 

-To translate the options in Customizer, first, make sure that  you have saved your own content and then go to Polylang->Strings Translation where you will find your strings in order for you to enter your own translation.

-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.

-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.

-To translate posts and pages follow this:  https://polylang.wordpress.com/documentation/setting-up-a-wordpress-multilingual-site-with-polylang/translating-posts-or-pages/


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 you parent theme's folder into the child theme's folder, open it and change the line:

<key name='theme_mods_zerif-pro'> or <keyname='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.

After this step, you should be able to translate the strings using Polylang->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 Polylang->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.

Are you facing any issue with this process? If you then feel free to start a new thread  at our forums.

Another way is to use Loco Translate plugin

  1. Install Loco Translate plugin
  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.