Tutorial: Translating A WordPress Theme

When developing premium WordPress themes and plugins it is essential that you build them with localization as standard, this allows the theme user to easily translate their WordPress themes so that the theme can be used by all languages.

In todays tutorial I wanted to show you how to add translation and localization support to a WordPress theme and how you can easily create the translation .po and .mo files.

1: Load The Theme Textdomain

In your funtions.php file you will need to first need to add the load_theme_textdomain() function. This function loads your themes translated strings by searching your themes root folder for the locale.mo file.

You will also notice the .mo and .po files will be stored in a seperated folder in your theme directory called ‘languages’. You should create that folder if it does not exist or change the file path in the function.

if ( !function_exists( 'yourprefix_theme_setup' ) ) {
	function yourprefix_theme_setup(){
	    // Load The Textdomain
	    load_theme_textdomain('themename', get_template_directory() . '/languages');
	    // Include Translations
	    $locale = get_locale();
	    $locale_file = get_template_directory() . "/languages/$locale.php";
	    if ( is_readable( $locale_file ) ) {
	    	require_once( $locale_file );
	    }
	}
}
add_action('after_setup_theme', 'yourprefix_theme_setup');

2: Translate Your Text

Hardcoding text in WordPress is a big no no, it will make it impossible to translate the text from English to another chosen language. When you want to add text to your WordPress site you should alway use one of these four built in WordPress functions that will mark the text strong for translation.

__('Your Text To Translate','themename');

The standard translate function, this simply returns your translated text.

_e('Your Text To Translate','themename');

Just like the above function, however this will echo your translated text, rather then return it.

_n('Your Text To Translate','themename');

Used for instances when your text will likely use plurals, this is often used in the comments section of your blog when listing the comment count.

_x('Your Text To Translate','themename');

This function is handy for translators as it allows them to disguingish between a verb and a noun. Pretty handy when translating from English.

3: Create Your Language Files With POEdit

Once your theme text is properly marked using the above WordPress translate functions you are ready to create your language files. For this task we will use an app called POEdit, when we run POEdit it will search through all the WordPress files and grab the text marked for translation.

The translation information will be collected and stored in a newly created or updated .pot file in the languages folder in your theme directory.

4: How To Use POEdit With WordPress

Open POEdit and click ‘File -> New Catalog’. Under the ‘Translation Properties’ tab enter Your project details.

Click the tab ‘Sources Paths’ and enter the base path details. As we are keeping our translation filed in a folder named ‘languages’ our base path would be ‘../’.

Click the tab ‘Sources keywords’, here we need to enter the four WordPress translate functions. This will allow POEdit to grab our text strings for translation.

Save the default.po file to your languages folder.

5: Translating Your Files

Once I have used POEdit to scan and update the languages files with the text strings for translation I use a handy WordPress plugin to make the translating process even easier.

For this process use the Codestyling Localization plugin, download this and activate it in your theme. Once activated navigate to Tools -> Localization. Click ‘Add New Language’.

Select your language and let the plugin scan the theme, once the scan is complete you or a translator will be able to go through each text string and easily add each respective translated equivalent.

To Conclude

You will see it is fairly easy to make your WordPress themes and plugins ready for translating and even easier to actually translate them if the theme author has built the theme with translation functionality as standard.

At first it took me a few attempts to get POEdit to properly scan and save my required translation strings, but once I got the hang of it, it was very easy.

References

http://codex.wordpress.org/Translating_WordPress
http://codex.wordpress.org/Function_Reference/load_theme_textdomain
http://www.poedit.net/download.php

DesignWoop Newsletter

Sign up to the DW newsletter, occasionally we send design & development related freebies, offers and exclusive deals.

Comments are now closed.