Translating Your WordPress Project

Have you ever needed to build a website to serve target markets in multiple countries? Perhaps you have a plugin or theme that you have authored and you want your users to be able to use it in their native language? By translating your WordPress project, you can reach many users and potential customers. More than half of all WordPress sites are using a language other than English already!

In this presentation you will learn how to translate your project from start to finish, from how translations in WordPress work to how to write code in a way that can be translated and the different tools you can use to translate your project.

Example source code: https://github.com/cameronjonesweb/cameronjonesweb-i18n

Transcript

1. Translating Your WordPress Project Cameron Jones
2. @cameronjonesweb Translating Your WordPress Project More than half of all WP sites aren’t English (51.1%) wordpress.org/about/stats
3. @cameronjonesweb Translating Your WordPress Project Terminology Guide • Internationalisation (i18n): The methodology of developing your project in a way that allows for it to adopt different translations • Localisation (L10n): The process of adapting your project to different languages and locales • Translation: A file that contains translated text in a different language to the source text
4. @cameronjonesweb Translating Your WordPress Project How Do You Localise A WordPress Site? • With a plugin • With third party services • Using a Multisite
5. @cameronjonesweb Translating Your WordPress Project Translation Plugins MultilingualPress Polylang WPML TranslatePress
6. @cameronjonesweb Translating Your WordPress Project Third Party Services Google Translate WeGlot
7. @cameronjonesweb Translating Your WordPress Project WordPress Multisite
8. @cameronjonesweb Translating Your WordPress Project Internationalising Themes & Plugins • Translations are stored in PO, MO and POT files • Core functionality determines the right language file based on site and user settings • This is what we will be learning today
9. @cameronjonesweb Translating Your WordPress Project How Do You Select A Language? Site Settings User Settings Network Settings (Multisite)
10. @cameronjonesweb Translating Your WordPress Project How Do You Select A Language? WPLANG Constant
11. @cameronjonesweb Translating Your WordPress Project How Do You Select A Language? locale Filter
12. @cameronjonesweb Translating Your WordPress Project WordPress Default Language • US English is the default language in WordPress, the same as most programming languages • You can create a theme or plugin using any language, it does not even have to be English. • But if you want to be able to translate it properly, your original text must be in US English
13. @cameronjonesweb Translating Your WordPress Project Text Domain • Put in your theme or plugin file header (style.css for themes or main plugin file) • Must be unique • If distributing on WordPress.org, must match the slug of the theme/plugin (more on that later)
14. @cameronjonesweb Translating Your WordPress Project Text Domain Plugins Themes
15. @cameronjonesweb Translating Your WordPress Project Updating Text So It Can Be Translated • WordPress uses PHPs gettext library • WordPress adds an abstraction layer on top of the native gettext library, so don’t use the native functions • Gettext doesn’t execute PHP code, so you can’t use variables with these functions
16. @cameronjonesweb Translating Your WordPress Project Gettext vs WordPress functions
17. @cameronjonesweb Translating Your WordPress Project Updating Text So It Can Be Translated
18. @cameronjonesweb Translating Your WordPress Project Updating Text So It Can Be Translated
19. @cameronjonesweb Translating Your WordPress Project Text that requires context
20. @cameronjonesweb Translating Your WordPress Project Security • Always escape translated text when you display it • As translated text can be filtered, a malicious actor could replace it with JavaScript • There are built in functions for escaping translations
21. @cameronjonesweb Translating Your WordPress Project Escaping Translations
22. @cameronjonesweb Translating Your WordPress Project Translations including variables
23. @cameronjonesweb Translating Your WordPress Project Translating numbers
24. @cameronjonesweb Translating Your WordPress Project International number formats
25. @cameronjonesweb Translating Your WordPress Project Translating numbers including variables
26. @cameronjonesweb Translating Your WordPress Project Translations in JavaScript • WordPress has included the wp-i18n script in core since 6.2 • With wp-i18n you can use the same functions as with PHP • Prior to this script being made available, you could use wp_localize_script to store translations in JavaScript variables
27. @cameronjonesweb Translating Your WordPress Project Best Practices For Translating Strings • Translate phrases (sentences and paragraphs) rather than individual words • Use print formatting instead of concatenation to include variables in translated strings • Don’t rely on existing core translations as context may be different, provide translations for all your strings
28. @cameronjonesweb Translating Your WordPress Project How do we actually localise? • WordPress uses .MO, .PO and .POT files to store translations
29. @cameronjonesweb Translating Your WordPress Project .MO Files • Machine Object file • Binary • What WordPress loads the translations from • Please don’t try to edit these files
30. @cameronjonesweb Translating Your WordPress Project .MO Files
31. @cameronjonesweb Translating Your WordPress Project .PO Files • Portable Object file • Human readable • Used to generate the .MO files • These are the files you put the translated text in
32. @cameronjonesweb Translating Your WordPress Project .PO Files
33. @cameronjonesweb Translating Your WordPress Project .POT Files • Portable Object Template file • Human readable • Used to generate the .PO files • Effectively a blank .PO file, just contains the original strings
34. @cameronjonesweb Translating Your WordPress Project Generating the translation files • Extract strings from source code and add them to a .POT file • Localise the .POT file into another language and save that as a .PO file • Use translation software to generate the .MO file
35. @cameronjonesweb Translating Your WordPress Project How do we generate a .POT file? • WP CLI • Grunt script • qSandbox
36. @cameronjonesweb Translating Your WordPress Project Use WP CLI to make a .POT file
37. @cameronjonesweb Translating Your WordPress Project Use Grunt to make a .POT file
38. @cameronjonesweb Translating Your WordPress Project Use qSandbox to make a .POT file
39. @cameronjonesweb Translating Your WordPress Project How do we generate .PO and .MO files? PoEdit
40. @cameronjonesweb Translating Your WordPress Project Naming convention for .PO and .MO files • Plugins: ${textdomain}-${language}.po/mo Eg: wordpress-seo-en_UK.po • Themes: ${language}.po/mo Eg: en_UK.po
41. @cameronjonesweb Translating Your WordPress Project Naming convention for .PO and .MO files Theme Plugin
42. @cameronjonesweb Translating Your WordPress Project Use Loco Translate for end to end localisation
43. @cameronjonesweb Translating Your WordPress Project Loading translation files • Themes and plugins must inform WordPress where the translation files are • Provide the directory where the files are, not individual files • The functions for themes and plugins take very different arguments
44. @cameronjonesweb Translating Your WordPress Project Loading translation files - Themes
45. @cameronjonesweb Translating Your WordPress Project Loading translation files - Plugins
46. @cameronjonesweb Translating Your WordPress Project Translating on WP.org • You don’t need to provide translation files for themes and plugins on WP.org • Translations are made on translate.wordpress.org • Translations are downloaded to wp-content/languages
47. About Me Cameron Jones WordPress developer & DevOps Engineer Founder of Mongoose Marketplace @cameronjonesweb on all the things cameronjonesweb.com.au
48. @cameronjonesweb Translating Your WordPress Project Links To view the slides visit: cameronjonesweb.com.au/wpleeds Source Code: github.com/cameronjonesweb/cameronjonesweb-i18n