Multilingual WordPress – Language Switcher plugin

Where exactly is the é key?

Where exactly is the é key?

It’s been a while, but here I am at last, continuing with the next instalment in this series of articles!

In the previous article we looked at an overview of what’s involved in setting up a multilingual blog.

In this article we shall look at installing the Language Switcher plugin. As mentioned last time, there are alternatives to this plugin, but this is a plugin I know well, is kept up to date and works.

Installing Language Switcher

Simply download the plugin from here and install the Language Switcher in exactly the same way as any other WordPress plugin. The plugin file itself (as at version 1.18) is installed directly in your plugin directory. The plugin also comes with a folder containing images of flags, and this too should be installed into your plugin folder.

Once uploaded, activate the plugin via Dashboard>Plugins.

Setting up the Language Switcher Options page

You should now set up the plugin’s Options page, available in Dashboard>Settings>Language Switcher.

Language Switcher plugin Options page
Click image to view larger version.

Throughout this series of articles I am assuming that we are setting up an English/French site. As can be seen in the above sceenshot, various options have been entered as follows:

Default language ISO code:

This is the default language for your site. In this case, because the default language of our site is English, I’ve entered the en ISO code.

Blog Languages:

This is where we enter the language codes for our two languages, English and French, and also specify the way dates will be displayed in both languages, and also a default text to be displayed when a Post/Page Loop doesn’t find any articles.

You will notice that there is a specific format for the language codes, each code comprising two elements: a two character lowercase language code, eg en for English, and a two character uppercase Country code (or Locale code, to be precise), eg FR for France. This latter code can be important in some languages, for example Portuguese, where there are some differences between the language of Portugal and Brazil. If you’re working with languages other than English and French, a list of these two codes can be found at WordPress in Your Language on the Codex.

Force Language Switcher URL suffixes to use ? or &

Next, we have a checkbox for overriding “Pretty Permalinks”. Personally, on several installations on different servers, I’ve never found the need to check this box and my permalinks have worked fine. However, if you do get persistant “Page Not Found” errors, try checking this box to override your Permalink settings.

Force Language Switcher to put a language URL suffix on every link

The next option is a checkbox for forcing a language URL suffix to be added to all permalink URLs. By default, the plugin does not automatically do this. This means that, by default (ie unchecked), some URLs for pages in the default language will be shown “normally”, ie www.mydomain.com/postname without the Language Switcher URL suffix.

My advice is to check this box and force the addition of the Language Switcher URL suffix on every page. Why? If you don’t do this, it is possible in some circumstances for a particular page to have two URLs:

  • www.mydomain.com/postname
  • www.mydomain.com/postname/language/en

Clearly, this could affect your search engine page rank, hence my advice to check this box.

URL slug for Language Switcher:

Finally, we have an option for how “Pretty” permalinks will be displayed. As with setting up your normal WordPress permalinks, a little thought is needed before you commit to an option here, so that you don’t find that you need to change the permalinks further down the road – with all the potential issues that can cause for your search engine ranking and your users’ bookmarks. In other words, give it some thought, set it up and then leave it alone!

By default, Language Switcher adds this suffix to your URLs: language/ followed by the language code, eg language/en for and English page, or language/fr for a French page. Personally, I always change this to setting to /lang as this makes for a slightly shorter URL.

Unfortunately there is no way for putting this suffix elsewhere in the permalink URL, and it always appears as a suffix at the end of the URL. (In my opinion, putting the Language Switcher suffix between the domain name and postname would be more logical, ie www.mydomain.com/lang/en/postname. Unfortunately, the WordPress permalink rewrite rules don’t permit this.)

How the plugin works

Language Switcher provides numerous filters for filtering the output of WordPress and determining which language to display the content in. I’m not going to describe this in detail as you don’t need to know all the technical aspects of the plugin code in order to use the plugin. However, the key elements of this are as follows:

  • Detects the user’s browser language and automatically switches to that language (if specifed in the plugin’s Options page and content exists in that language) or, alternatively, displays content in the specified default language.
  • Filters all standard WordPress content including Category names, Tag names, Post/Page titles etc.
  • Provides a way for users to manually switch language via a template tag function which can be added to your theme files, eg the header.php.

How to create multilingual content

In order for the plugin to switch language, you must create your content in the two languages when writing Posts/Pages. This is done by adding simple tags to enclose the different language content. The tags are entered in this format:

  • [lang_en]…blah blah…[/lang_en] for enclosing English content
  • [lang_fr]…blah blah…[/lang_fr] for enclosing French content

The important points to note are:

  1. Always use an opening and closing lang tag
  2. The tags use the relevant language ISO code mentioned earlier, and which must be already set up in the plugin’s Options page.

Creating a multilingual Post

This screenshot shows how the language tags are used to create the multilingual content when writing a Post:

Write Post using Language Switcher tags
Click image to view larger version.

Note that I do not use a paragraph break between the closing [/lang_en] and opening [lang_fr] tags. This is important to avoid WordPress adding an unwanted empty paragraph before the French text. You will also notice that the language tags have been used to create two language versions of the Post Title. The plugin uses thes etags to determine which content to serve depending on the language selected by the visitor to your site.

Categories, Tags, Links etc

Exactly the same concept applies when creating Categories, Tags, Links, etc. Simply use the language tags to enclose the category, tag or link name. Note that the plugin takes care of the slug – though this can be edited in the normal way.

Allowing Users to select the language

The Language Switcher provides a neat way of presenting a list of available languages somewhere on your site, using the following function inserted into an appropriate place in your theme (perhaps header.php or sidebar.php):

The function takes three arguments:

  • Flags: true or false (true means to use flags to indicate languages)
  • Text: true or false (true means to use text language names)
  • HTML Tag: (Language Switcher 1.10 and later versions only) HTML tag to enclose each flag/language name in — enclose in single-quotes.

Therefore the example here:

doesn’t display flags (false), does display language names as text (true), and wraps each language name in a <li> tag.

As mentioned above, the best place to display this list is in header.php or sidebar.php.

Next instalment…

The plugin will now deal with all multi-lingual content created via the WP Dashboard, for example: Posts, Pages, Categories, Tags etc. However, what we’ve looked at so far does not deal with text which is hardcoded into your existing theme template files. Therefore, in the next article (and I promise you won’t have to wait so long next time) we will look at “internationalising” theme template files.

PS: I don’t provide support for the Language Switcher plugin – please refer to the plugin author’s site for support details. Thanks!

Comments

  1. I’ve been looking all over for something like this. I’ve tried qtranslator, mlanguage and all sorts of WordPress plugins for multi-lingual functions. Will definitely give this a shot. Thanks!

    • Hi Mark,

      Give it a try. It’s a nice plugin and is actively supported by its author – which is really important with frequent WP updates.

      Good luck!

  2. This could be perfect for an upcoming project – thanks for the walkthrough :)

    /Doug

  3. Where in the header or sidebar php do you put this?

    Sorry, not Mr. Computer Language savvy here! Any help would be appreciated.

    • @ Andres,

      Assuming you are talking about the langswitch_list_flags() function, I would put it at the top of your sidebar file (usually called sidebar.php in most themes). You will of course have to style the output with CSS.

      Hope this helps.

  4. Very good guide, works splendid for me! Thanks!

  5. do you know if google also crawls the other (than default) languages?

  6. Note from Jennifer Hodgdon, the plugin author: As of April 2010, this plugin is no longer being maintained. Please read this news posting for more details.

    • Yeah, I saw it.

      It’s a shame, but quite understandable – maintaining a free complex plugin is a lot of work for little reward. :-/

      Thanks to Jennifer, for all the hard work she put into the plugin over the years.

  7. Hey!
    I was just searching for a language swithcer plug in and this one seems to to the pretty work.
    But i’m havin troubles activating it. After i click “Activate” it shows me teh following message: “Plugin could not be activated because it triggered a fatal error.” ….what am i doing wrong here?
    can you provide a little bit of support? i am a newcommer among the WPsociety, so i have less expierience.

    i am using WordPress 2.9.2.

    thanx i nadvance.
    Any answer form you i will take in consideration. Thanx

    • No, sorry, I don’t provide support for this plugin. This kind of error is usually a result of having an old version of WordPress. Check your server logs to see the exact error.

  8. Does this Plugin work with the latest wordpress 3.0? THX Alex!

  9. I’ve tried many plugins but it failed to work well. I hope this will help me much.
    Thanks for info.

  10. Hello!

    Great job!

    But what we can do when it need to switch also the images in html code(for example I used buttons like images). How can we make a relation between language and displaying the right images? Is there someone who know the php code that must created in page?

    Thanks.

  11. simon says:

    i changed my language settings to utt8_unicode_ci but then deactivated the language switcher plugin. now i can’t use the wordpress dashboard? does anyone know why? i just wanted to fix the flags as they wouldn’t show. now, i can’t do anything in the dashboard. please help!!!

  12. Salvofan says:

    Hi Mark,
    the plugin doesn’t pick up the right language for postmeta contents.

    Is there a way to make it working in my theme?
    Maybe a function I can add myself in the specific place I need it?

    Thanks.
    SF

Trackbacks

Leave a Comment

*


× 6 = twelve

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>