WPML Multilanguage plugin for Wordpress

WPML Translation plugin is the best option when you need to translate your Wordpress website into multiple languages. The plugin makes it easy to translateevery page, post and any other content you have on your Wordpress website.

Content:

1. Installing WPML to Wordpress: Slide 2 – 62. Modifying the WPML flag/language switcher: Slide 7 – 113. Adding translations to pages/posts: Slide 12-144. Adding translated pages to navigation menu: Slide 15-165. Translating custom fields/sections: Slide 17-186. String Translations: Slide 19-23

WPML Multilanguage plugin for Wordpress

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.

Add Username and Password.You can find these on Moonlight tasks -> Passwords -> WPML

Installing WPML to Wordpress

http://wpml.org/

Once logged in, click on Downloads section.

Download the WPML Multiligual CMS,WPML String Translation andWPML Translation Managementplugins.

These 3 plugins are good to havewhen you start translating your WP website.You can also find other plugin add-ons, and you can download them later on if needed.


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


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.


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.


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


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: <?php do_action('icl_language_selector'); ?>And paste it to our header.php file.


So we go and find the header.php file on the theme files, Appearance -> Editor

Then just paste the code somewhere on the file <?php do_action('icl_language_selector'); ?> and Update File.Go to check your website frontend and you should see the language selector on your header.


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/

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 < count($languages)){ echo __('This post is also available in: '); foreach($languages as $l){ if(!$l['active']) $langs[] = '<a href="'.$l['url'].'">'.$l['translated_name'].'</a>'; } echo join(', ', $langs); } }

You can add the codeanywhere on the filebut make sure it’sbetween the openingtag <?php and the ending tag ?>

http://wpml.org/documentation/getting-started-guide/language-setup/custom-language-switcher/


Next, go to your header.php file again and add/or change the previous selector language code with<div id="flags_language_selector"><?php language_selector_flags(); ?></div > 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

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


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…”


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.

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.

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.

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

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 seethe country flags for each product. You can nowadd 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…

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

String Translations

Next, go to WPML – String Translations and you will see a list of all the sections of your templatethat 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.

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

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”

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.

Hope you enjoyed the guide andsee you next time!

The End

WPML Multilanguage plugin for Wordpress

Documents

Transcript of WPML Multilanguage plugin for Wordpress