1. WPML Translation plugin is the best option when you need to translate your Wordpress website into multiple languages. The plugin makes it easy to translate every page, post and any other content you have on your Wordpress website. Content: 1. Installing WPML to Wordpress: Slide 2 – 6 2. Modifying the WPML flag/language switcher: Slide 7 – 11 3. Adding translations to pages/posts: Slide 12-14 4. Adding translated pages to navigation menu: Slide 15-16 5. Translating custom fields/sections: Slide 17-18 6. String Translations: Slide 19-23 WPML Multilanguage plugin for Wordpress

2. Unfortunately, the WPML plugin is not free but Moonlight has subscribed to it. To download the plugin you need go to their website http://wpml.org/ and login with the Username and Password that you can find on the Moonlight Passwords spreadsheet. http://wpml.org/ Add Username and Password. You can find these on Moonlight tasks -> Passwords -> WPML Installing WPML to Wordpress

3. Once logged in, click on Downloads section. Download the WPML Multiligual CMS, WPML String Translation and WPML Translation Management plugins. These 3 plugins are good to have when you start translating your WP website. You can also find other plugin add-ons, and you can download them later on if needed. Installing WPML to Wordpress

4. Next login to your Wordpress backend and install the WPML plugins you downloaded. First install the Sitepress-multiligual-cms plugin and activate it. Then install the other 2 plugins: WPML String Translation and WPML Translation Management NOTE: After installing the first plugin, WP is asking wheher you want to see a quick overview. You can just click “NoThanks…” and move on Installing WPML to Wordpress

5. Now that you have successfully installed and activated the WPML plugins – click on the WPML section on the left WP sidebar. You will see WPML setup screen that helps you to setup the basic language configurations for you Wordpress website. 1. Choose your existing website language 2. Select the languages you want to add to your website. You can add/edit languages anytime with the WPML plugin. 3. Choose the language switcher. Here you can choose where on your website you want the language switcher or language flags to show up. Installing WPML to Wordpress

6. Click Finish, and you have finished the basic WPML configuration. Now, if you go to your pages or posts section on your Wordpress backend, you can see new flags added there, these are the new languages you added. By clicking the + sign you can add a transalation for the page/post. Installing WPML to Wordpress

7. Next I will show you how to make the flags/language selector visible on the frontend. Often you might have already translated some your pages but you cannot see the language switcher anywhere on your website. This is because it hasn’t been configured with your theme yet. Modifying the WPML flag/language switcher Go to WPML -> Languages –> Language switcher options

8. Modifying the WPML flag/language switcher Then on the Language switcher options tab, first you have the option to show the language switcher on a widget, for example on a sidebar. However, you can set it to “- none-” as we want to have the language switcher on the header part of our template. To show the Language switcher on the header part of our template, we need to copy the code: And paste it to our header.php file.

9. Modifying the WPML flag/language switcher So we go and find the header.php file on the theme files, Appearance -> Editor Then just paste the code somewhere on the file and Update File. Go to check your website frontend and you should see the language selector on your header.

10. Modifying the WPML flag/language switcher If you want to add the country flags only as the language selector on your website, you need to add some code to functions.php file. You can also find out how to do it on the WPML website: http://wpml.org/documentation/getting-started-guide/language-setup/custom-language-switcher/ http://wpml.org/documentation/getting-started-guide/language-setup/custom-language-switcher/ First, go back to your editor (Appearance -> Editor), and open the functions.php file. Copy paste the following piece of code to the functions.php. function icl_post_languages(){ $languages = icl_get_languages('skip_missing=1'); if(1 '.$l['translated_name'].' '; } echo join(', ', $langs); } } You can add the code anywhere on the file but make sure it’s between the opening tag

11. Modifying the WPML flag/language switcher Next, go to your header.php file again and add/or change the previous selector language code with and save/update the file. Now, if you check your website you should see the flag language switchers on your header. To change the position, you can add css rules to your style.css file by using #flags_language_selector

12. Adding translations to pages/posts Adding new translation to an existing page/post is rather easy. Just go Pages/Posts section and you will see the plus signs for the existing languages that are available for translations, just click the language you want to add. Remember if you want to add/remove languages, you can just go to WPML – Languages – Add /Remove Languages.

13. Adding translations to pages/posts On the new translation page you can see the language you are adding, title of the original post and an option to copy the content from the (default language) English. Copy content from English button can be useful when you want you to remain the page layout and the images from the original post. Click the Copy content from English button, this will copy all the text and images from the original post. NOTE: Only the main content text and images will be copied from the article when using “Copy content…”

14. Adding translations to pages/posts Once you have finished the translation page just click “Publish” and you are done. On the Posts section you can see the + icon changed to “pen” icon. This means that there is an existing translations for the article. By clicking the icon you can edit it.

15. Adding translated pages to navigation menu When you create a new translation for your page/post often it doesn’t show up automatically on your navigation menu. You will need to do this manually. On your Wordpress Dashboard, go to Appearance -> Menus. On the top you can see the Menu name, click on the menu tab you want to add the translated menu item. Then if the menu does not have a translation yet. Click on the small language icons on the right.

16. Adding translated pages to navigation menu You should now see the pages for your translated menu. For each language menu you will only see the pages that are translated in that specific language. For example for German we have only one existing page so we cannot add any other pages here. You will see all the items that can be added on the left sidebar (Custom Links, Pages and Categories) Once you add a menu a menu item and click save menu, the menu item will show up on the website. There is only one menu item “Sample German” since we don’t have any other pages for German.

17. Translating custom fields/sections You can find that there are many sections on your Wordpress that you cannot translate on the backend. However, the WPML makes these sections available for translating. For example the search field default text needs to be translated manually First thing you should do is to go to WPML -> Translation Management -> Multilingual Content Setup. Scroll all the way down on that page and you should see a Custom posts and Custom taxonomies sections. Here you choose what do you want to translate on the template.

18. Translating custom fields/sections For example if you want to add translations fields to the products, click on the “Translate” and “Save”. Then go to your Products section and you can see the country flags for each product. You can now add translations for these products. The same goes for any section of the website, if there is no translation fields available, go to WPML -> Translation Management -> Multilingual Content Setup and check whether the section is added to the translated section. If your section doesn’t appear on this section then go to WPML -> String Translations on your WP Dashboard. See more on next slide…

19. String Translations String Translations helps you to translate the template/theme you are using. Sometimes by default the translation plugin cannot find all sections that you might want to translate. String Translations can help with this. First go to WPML -> Theme and plugin localizations Then on Select how to localize the theme click Translate by WPML and “Save” WPML plugin will scan and make all the section on your theme available for translations.

20. String Translations Next, go to WPML – String Translations and you will see a list of all the sections of your template that are available for translating. There might be quite many string translate within the template, it’s useful to use the search field on top right to find the content you want to translate.

21. String Translations Let’s say you want to translate the Widget title “Archives” into German language. Archives widget on the theme First do a search for a word “Archives” on the String Translations section. You will see a list of strings that has the word “Archives”.

22. String Translations You can see there is a widget title “Archives”. Click on the blue title “Translations” and the translations window will open. Now, add the translation, click on “Translation is complete” and “Save”

23. String Translations Go back to the page where the widget title is and you will see the translation appearing on that page. If you want to translate any other sections, just do a search on the String Translations page and you will be able to add the translation there. NOTE: Remember to install the WPML String Translations plugin to Wordpress, otherwise you are not able to translate the strings.

24. Hope you enjoyed the guide and see you next time! The End