Displaying Different Logos with WPML
by lperrie on | Posted in Tutorials | 26 comments
Living in Montreal, I often have to create multi-lingual websites for clients. That means finding the right plugin for the job. I don’t always use WPML, but it’s one of my go-to plugins when it comes to creating websites with multiple languages.
A recent client requested that their site display a different logo for each language. In order to make this happen, I had to code a simple conditional statement using PHP. But I needed to know which language was selected to display the right logo.
I wasn’t sure if WPML stored the current language selection so I had to do a bit of research. Thankfully, I discovered it did.
The Language Code
When a visitor selects a language, a two-letter language code is stored in the constant ICL_LANGUAGE_CODE. Using this and a little PHP, I wrote the following block of code to give my client what they wanted.
<?php if ( defined( 'ICL_LANGUAGE_CODE' ) && 'fr' == ICL_LANGUAGE_CODE ) { // If the language is French ?>
<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/images/fr_logo.png" class="site-logo" alt="" />
<?php } elseif( defined( 'ICL_LANGUAGE_CODE' ) && 'it' == ICL_LANGUAGE_CODE ) { // If the language is Italian ?>
<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/images/it_logo.png" class="site-logo" alt="" />
<?php } else { // If the language is English, the default ?>
<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/images/en_logo.png" class="site-logo" alt="" />
<?php } ?>
I placed that in header.php and used the class site-logo to style the CSS to match the client’s requested design.
Is there a better way?
If you take a closer look at the code above, you’ll notice that all the filenames have the language code as a prefix. That means you can simplify things even more which is always a better approach when it comes to coding.
<?php $lang_prefix = ( defined( 'ICL_LANGUAGE_CODE' ) ) ? ICL_LANGUAGE_CODE : 'en'; ?> <img src="<?php echo esc_url( get_template_directory_uri() ); ?>/images/<?php echo esc_attr( $lang_prefix ); ?>_logo.png" class="site-logo" alt="" />
Using the WPML plugin’s ICL_LANGUAGE_CODE constant lets you create all kinds of custom code specific to each language. Displaying different logos is just the tip of the iceberg.
NOTE: Konrad from WPML mentioned in a comment below a better way to get the current language code. It’s probably a good idea to use that one instead.
Hello
Thank you for posting about WPML, I am Konrad who works in WPML company in compatibility team 🙂 Your blog post just popped up in RSS reader 😉
Your code works, but I am not sure that we have no more elegant solution for such things like you described. You don’t need to check constants and do group of if/else statements or use ternary operator like in second case.
We decided to move all our api to use hooks. So for checking current language we have wpml_current_language filter which returns… current language code 🙂
https://wpml.org/wpml-hook/wpml_current_language/
So in your second code sample first line could be:
$lang_prefix = apply_filters(‘wpml_current_language’, ‘en’);
and then this will return current language code or ‘en’ if for some reason language is unresolvable (for example WPML is inactive).
Additional tip: pass ‘nolang’ as second argument and then you will get ‘nolang’ when WPML is inactive so you can prepare some general logo for this case.
Here is a list of all filters and actions of our new api
https://wpml.org/documentation/support/wpml-coding-api/wpml-hooks-reference/
But again: your code will work too, only thing is that we consider using our constants as deprecated
Awesome! Thanks for letting me know about the better way of getting the current language code. I’ll make a note above to check out your comment. 😉
Hi,
Again a wonderful article. I tried it myself and it is working fine.
Konrad’s way of doing it also a great option.
Regards
T Alam
Hi,
We never send them to wpml to get the theme listed as compatible.
thanks for this awesome article Mr. Bavota
I would like to edit the title of the pages in wordpress and instead of just page title, to make them in the form “Sitename | Page Title”. How can I translate the Sitename with WPML?
Thank you.
Thanks C.bavota for sharing this article.
“Displaying Different Logos with WPML” When that’s done, we’ll show you where on your website?
it’s a good work indeed. By creating different logos and connect them with WPML which concludes ur article into the easiness for the clients or people. Thank you for sharing with us.
thanks a lot for your tutorial but after all I think WPML is very solid yet!
Thanks a lot for this post, just working on a multi language site for a client using WPML and needed to tweak the icons a bit, saves so much time when you dont have to dig around in the code yourself 🙂
Just what I was looking for! Just got started with WPML, found the solution I was looking for 🙂 thanks again.
You just solved my problem bavota, thank you so much
Does this plugin support Persian language?
Nice and informative tutorial on displaying different logos with WPML. Can I use this to display different logos on desktop and mobile version of site ?
Regards
I really appreciate your efforts Mr. Bavota, to share this stuff. Good work. Cheers 🙂
Once again another great post Bavota!
Just placed this on my website and it is working a treat however it seems to be a bit buggy when coming form mobile although, this could be the proxy I’m using ..
Thanks!
Thank you c.bavota and thank you Konrad. I tried both ways and I think both works great!
Thank you!
//Johan Prince
I faced this problem six months ago and did not get any solution. As a result, I failed to satisfy one of my clients and lost forever. I wish I could have this solution just before six months.
The hope is that I will not lose any clients in future. Thanks for your great solution.
Great post.
I used this plugin and had good experience with it. Awesome plugin to creating your websites with multiple languages
Great post.
I used this plugin and had good experience with it. Awesome plugin to creating your websites with multiple languages
Excellent Post! Was looking for some information about WPML as I am new to all this and it was very handy. Thanks c.bavota will definitely be using your site more often!
I’m pretty new to creating websites with multiple languages. This is a really cool plug-in. Thanks for the article. Been reading a few articles on your site and I’m pretty impressed.
Thank you c.bavota and Konrad, These days it is critical to have language options for your end users. It is a must , and will increase long term conversions and interactions as well.
so help me thanks for sharing .
Thanks bro 🙂
I used this plugin and had good experience with it. Awesome plugin to creating your websites with multiple languages