Theme Translation
There are a lot of ways to translate a Wordpress Theme on your website. You can do it manually, use a plugin or machine translation, or even hire a professional to do it for you. However, regardless of which approach you choose, it pays to understand how to edit WordPress language files manually.
We give two simple ways to make it easy:
- Using Wordpress Plugin Loco Translate
- Using dedicated program Poedit
Translation with “Loca Translate”
The easiest way of translating our theme is by using the Loco Translate plugin. The best news thta Loco Translate WordPress Plugin is a free and can be installed from the default repository of WordPress.
Required theme translation files or static strings are available in the HeroMe theme. Therefore, in this manual, we will consider how to translate required theme translation files and keep translations up to date in these HeroMe theme in future.
Also, it is possible to translate our Theme using any other plugin which you can find in WordPress Plugin Repository. Best news that principles of translation are the same im most plugins.
Install Loco Translate
To install the plugin, go to Dashboard and find the Plugins section from the left menu and choose Add New.
Dashboard -> Plugins -> Add new.
On the opened page, you need to search Loco Translate, install, and activate it.
Create HeroMe Theme Translate File
After installing and activating the translating plugin, find in WordPress admin panel Local Translate menu ago to Loco Translate -> Themes.
On the opened page choose HeroMe Theme. Now, from here you can create your own language to translate the not editable content of the theme.
Create a desirable language by clicking New language.
Most important!
It is required to store the translation file in “/wp-content/languages/themes/herome/languages folder to keep translation during the theme updates.
After clicking the Start Translation button, you will be directed to the Loco Translate editor where you can start translating the theme strings.
Once you have done with your language translation the translated files can be found in ../wp-content/languages/themes That’s how it is done!
Update Herome Theme Translate File
The first thing to do update theme language is to update the main language file, where all the theme strings are stored. Go to the Dashboard > Loco Translate > Themes > Herome and choose Edit template.
Click on the Sync button to merge new strings from the source code to the main language file.
Warning: This is NOT a translation file. Manual editing of source strings is not recommended.
Click on the Save button to save the new strings.
Go to the list of the translation files for updating the needed translations and the same up instructions. Select your translation file and click on the Sync button and Save changes.
Translating with “Poedit”
Using Poedit to translate your WordPress themes and plugins is remarkably simple once you’ve installed the tool. For this tutorial, we’re going to be using the free version of Poedit. There’s also a premium version available, including translation ‘suggestions’ and semi-automatic localization. However, if you just want a tool to simplify manual translations, the free version of Poedit will do. You can download this program by this link Poedit.
You can use Poedit to pull all the strings from any plugin or theme you’re working on and use this to generate a POT file. To do so, open Poedit and go to File -> New.
The program will ask you to select the language you want to generate a new file for. Once you’ve done this, on the next screen click on Extract from sources:
From here, set a name for your project under Translation properties and confirm the language you chose earlier:
Confirm the changes to the project, then go to File -> Save. Poedit requires you to save the project before you can move on. After you do so, reopen the Extract from sources window and this time, go to Sources paths.
Here is where you tell Poedit which files and folders to look into to extract their text strings. Your plugin or theme should have its own folder, so click the + icon under Base path and select it:
After you select your theme or plugin’s folder, go to the Sources keywords tab and look for the + button there. Click it and add the following two keywords:
- __
- _e
- esc_html__
- esc_html_e
- esc_attr_e
- etc.
The full list you can find here.
The selection should look similar to the following:
Click on OK and Poedit will start extracting all the text strings it can find. Once the process is complete, you’ll end up with a list similar to the following:
In the next step, we’ll show you how to translate this text. Before moving on, close Poedit and find the project file you just set up. It should be a PO file, but you’ll want to rename it to a POT file.
This is because we want to use the file as the source for all your translations. Poedit will be able to open it just the same, but when you do so, it will ask you what language you want to create a translation for, before generating new PO files for those.
Open an Existing PO File
As soon as you launch Poedit, you’ll see the options to either edit or create translation files:
Opening a PO or POT file is very straightforward. Simply select the top option, find the file on your computer, and that’s it! As long as the file is formatted, you’ll see a list of all the strings it contains:
To translate the theme or plugin, you need to click on each available string in its original language, then use the Translation field at the bottom to enter your translation:
Notice that you can add notes for other translators using the Add comment button on the right. Poedit also includes suggestions from Microsoft Translator, which can help you localize strings. The free version of Poedit limits you to only 10 suggestions though, which run out pretty quickly in our experience.
As you progress through translating a PO file, you can save the changes you’ve made at any time. When you’re completely done with translating, you can open the file menu and select the Compile to MO option.
Languages directory
The languages directory is mapped to /wp-content/languages/themes and is intended for *.po and *.mo language translation files. Internationalized themes expect to find language translation files located in ../wp-content/languages/themes
The naming convention of language translation files for themes follow the pattern:
- Themes:
theme-name-{locale}.mo
Example:languages/themes/herome-en_GB.mo
So, after translating strings by using Poedit, you need to download and place the *.mo file in the directory mentioned above: ../wp-content/languages/themes.
l10n i18n localization Internationalization
| __() | Translates the specified text using a translation file and returns it for processing. |
| _e() | Translates the specified text using a translation file and displays it on the screen. |
| _ex() | Displays the translated string in the specified context. |
| _n() | Gets the singular or plural translation string that matches the specified number (1 comment, 2 comments). Localization function. |
| _nx() | Translates and returns the singular or plural form of a number based on the specified context. Similar to _n() , only taking into account the context. |
| _x() | Gets the translation of the specified string, given the specified context. |
| date_i18n() | Gets a localized date (translated to the current language) from the passed unix timestamp. |
| determine_locale() | Gets the current site locale (site language, such as en_US) that is appropriate for the current request. |
| esc_attr__() | Translates the specified string and processes it with the esc_attr() function . |
| esc_attr_e() | Outputs the translated text cleared by the esc_attr() function . |
| esc_html__() | Translates a string, replacing special characters in it with HTML entities. Returns text that can be displayed in HTML as HTML code. |
| esc_html_e() | Translates (locals) a string and clears it for display – replaces special characters in it with HTML entities. |
| get_locale() | Sets the global variable $locale and gets the current locale (site language index, for example, en_US ). |
| get_user_locale() | Gets the locale (translation language) of the current or specified user. |
| is_locale_switched() | Checks whether the locale (translation language) has been switched and whether the switch_to_locale() function has been used . |
| is_textdomain_loaded() | Determines whether the localization file for the specified domain (translation key) is loaded. |
| language_attributes() | Displays attributes for the HTML tag <html> with the values of the current language: lang=”ru-RU” |
| load_child_theme_textdomain() | Loads a child theme translation file (.mo) into memory for further work with it. |
| load_muplugin_textdomain() | Includes a .mo translation file for required plugins (mu-plugins) from the specified folder. |
| load_plugin_textdomain() | Includes a .mo translation file from the specified folder. Does not work with MU plugins. |
| load_textdomain() | Includes the specified translation file. |
| load_theme_textdomain() | Loads a theme translation file ( .mo ) into memory for further work with it. |
| number_format_i18n() | Converts a number (integer or fraction) into a format suitable for the current locale (site language). |
| switch_to_locale() | Allows you to programmatically switch the site language. |
| translate() | Gets the translation of the specified text. |
| unload_textdomain() | Unloads (deletes, cancels) the attached translation file. |
| wp_localize_jquery_ui_datepicker() | Localizes (translates) jQuery date picker script: jQuery UI datepicker. |