WordPress: Insert multilingual Facebook Like Button

If you’re using the qTranslate plugin for WordPress and want to insert the Facebook Like button in the corresponding language I came up with a small piece of code that you can insert into, e.g., your theme’s functions.php to get this working.

Implementation

On this Facebook developers page you can find information on how to display the Like button in different languages; generally speaking the documentation is pretty neat and it’s worth checking it out because you can clearly see that it was written by developers for developers. Loading the correct JavaScript for the button is simply replacing the path in the URL that identifies the language with the correct code.

If you’re using qTranslate the current language code is stored in the variable $q_config['language']. I’ve crafted a small PHP function that outputs the corresponding JavaScript and added it to my theme’s footer action to output the code there; you can output it where ever you want by just calling the function in the right spot in your theme.

<?php
function facebook_javascript() {
  global $q_config;
  $fb_lang = 'de_DE';
  switch ( $q_config['language'] ) {
  case 'en': $fb_lang = 'en_US'; break;
  case 'fr': $fb_lang = 'fr_FR'; break;
  case 'it': $fb_lang = 'it_IT'; break;
  case 'es': $fb_lang = 'es_ES'; break;
  }
?>
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/<?php echo $fb_lang; ?>/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<?php }
add_action('wp_footer', 'facebook_javascript');
?>

As you can see the switch statement selects the correct language code and outputs it in the JavaScript. You can add or remove languages simply by adding / removing more case statements inside the switch; the default language is set to German in this example.

Conclusion

I really like the qTranslate plugin due to its simplicity and as you can see it’s pretty easy using it for special requirements like this one. I’ll use this on various websites and as far as I can tell the users like it that the Like button is presented in the corresponding language and not only in the standard language of the website.

3 comments ↓

  • rick says:
    Hi! I found your code as I was looking to have the like button switch to the current qTranslate language ( I use en_US and fr_CA). Your code works perfectly, the social plugins are converted to en/fr when toggling language, but it ONLY works when I’m logged in WordPress. As a regular user (logged out), everything remains in English. Any clue?

    Thanks so much!

  • Hi Rick,
    I’ve used this code on different websites where I set the WPLANG constant in wp-config.php to the corresponding language of the website, i.e. in your example I had a website example.us with WPLANG set to en_US and another site example.ca with WPLANG set to fr_CA. This way the above code is working just fine.
    If you’re using this on a single website you should place a var_dump($q_config) right above the switch statement in the code and check where qTranslate stores the current language. Simply toggle the language back and forth and see what changes in the $q_config array. Maybe the language code is stored in another element, so instead of using $q_config['language'] replace language with the correct element’s name.
  • rick says:
    Thanks, I just sent you a private msg via the site as I didn’t want to write a novel within a comment!

    Thanks again for your help!