Multiple language support in your site

@ttbarnesMay 24.2010

Hiya,

What are the best resources for making a website compatible with many languages?

For example, you can click ‘English’, ‘French’, or ‘German’ on the actual website and then the whole site would obviously become English, French or German, without going to an external site – this will be all inside the site.

I’m not sure what topic this should have gone under – my apologies in advance; this is a new one to me.

Any help with this would be most appreciated.

Thank you.

Tony ?

to post a comment

Full-stack Developer

13 Comments(s) _↴

@chris22May 24.2010 — #Hi, a popular way of providing one webiste in many languages is with a "url prefix", for example:

www.yoursite.com/en/page1, www.yoursite.com/en/page2

www.yoursite.com/tr/page1, www.yoursite.com/tr/page2

www.yoursite.com/ru/page1, www.yoursite.com/ru/page1

This way you can determine which version to server by looking into first /xx/ parameter. This is an approach adopted by Symfony framework:

http://www.symfony-project.org/book/1_0/13-I18n-and-L10n

@sohguanhMay 25.2010 — #Hi, a popular way of providing one webiste in many languages is with a "url prefix", for example:

www.yoursite.com/en/page1, www.yoursite.com/en/page2

www.yoursite.com/tr/page1, www.yoursite.com/tr/page2

www.yoursite.com/ru/page1, www.yoursite.com/ru/page1

This way you can determine which version to server by looking into first /xx/ parameter. This is an approach adopted by Symfony framework:

http://www.symfony-project.org/book/1_0/13-I18n-and-L10n[/QUOTE]

Other approach I have seen in other websites is upon login you are asked to choose your language and country so as to speak. Then the application uses cookies to store your language and country preferences for all subsequent pages navigation. Such technique has a flaw as in one can disable cookies and it will not work again.

So I still like the url prefix method. Simple and effective ?

@criterion9May 25.2010 — #Other approach I have seen in other websites is upon login you are asked to choose your language and country so as to speak. Then the application uses cookies to store your language and country preferences for all subsequent pages navigation. Such technique has a flaw as in one can disable cookies and it will not work again.

So I still like the url prefix method. Simple and effective ?[/QUOTE]

There is no need to store that data in a cookie if the user is also logging in. That data can be stored with login information on the server and used regardless of cookies being enabled.

@sohguanhMay 25.2010 — #There is no need to store that data in a cookie if the user is also logging in. That data can be stored with login information on the server and used regardless of cookies being enabled.[/QUOTE]

You are correct. What I say is for that website implementation design, I can view the JS code. Somehow certain websites focus on heavy client side solution while some focus on heavy server side solution.

My personal view is to strike a balance. For fanciful widgets/effects to wow the users, JS is the best client solution. For non-GUI like in this case language + country a server-side solution would be better.

But the url prefix is still a viable solution isn't it ? Sometimes we think too complicated to forget a simple solution is all that is needed :p

@ttbarnesauthorMay 25.2010 — #Thank you for the replies everyone, i'm learning about this already! ?

I think that using a url prefix will be the best technique to use from what I know so far.

Are there any other url prefix frameworks/techniques that can be used for this?

Thanks once again guys, most appreciated.

@tracknutMay 25.2010 — #
Are there any other url prefix frameworks/techniques that can be used for this?
[/QUOTE]

I do it this way:

By default, pages are presented in the language the user has set for his browser

User may click on a codelittle flag explicitly selecting a language

Language code is stored in the PHP session variable

As each page is requested, appropriate text information is pulled from an XML file that has the text stored in multiple languages

So in my case, the url is not different for each language, and there is no client-side requirement.

Dave

@ttbarnesauthorMay 26.2010 — #Thank you Dave - this also sounds great.

Could you please give me some more pointers? Mainly:

How would the foreign language code be generated in the xml - Manually!?

Do you know of a framework that I could start from?

My greatest thanks, you guy's are great and i'm learning a lot from you all. ?

@tracknutMay 26.2010 — #Thank you Dave - this also sounds great.

Could you please give me some more pointers? Mainly:

How would the foreign language code be generated in the xml - Manually!?
[/quote]

All manually, in my case. The XML file looks like this:

<i>
 </i>&lt;page&gt;
 &lt;name&gt;homepage&lt;/name&gt;
 &lt;line id="1" language="en"&gt;Hello&lt;/line&gt;
 &lt;line id="1" language="fr"&gt;Bonjour&lt;/line&gt;
 &lt;/page&gt;

Then in the PHP code for displaying the homepage, I have something like "DisplayText ('homepage',1);" where I want the text displayed. The function DisplayText uses SimpleXML to read the XML file when and of course tests the language code stored in the $_SESSION variable to decide whether to use the english or french version of the text.

Of course you could also store all the text in a database instead of an XML file.

Do you know of a framework that I could start from?
[/QUOTE]

Unfortunately I don't. I just worked this up as I needed it. I'm no expert on internationalization, and just kind of looked around as you are when I needed a solution. The only issue I see with mine is that I'm not sure the performance is there if this was a high volume site. Certainly putting it in a DB would be better from a performance perspective.

Dave

@ttbarnesauthorMay 27.2010 — #Thank you for the latest Dave - most appreciated.

That's a good technique, but unfortunately I won't be using it this time; simply because the site that i'm building for this would like many languages supported - One of them being Japanese, also many european countries..

Obviously I don't have the time to learn various languages and code them manually, so i'll keep an eye out for any other techniques for executing this.

Thank you once again though, i've learnt many new things from this and I will hopefully be using your technique in the future for smaller sites. ?

All the best,

Tony.

@criterion9May 27.2010 — #Lots of sites store the translations in a database for easier management of larger contents. You will probably still need to get a translator as the automated translations are never very good at garnering meaning from phrases and you might inadvertently offend someone in their native tongue without realizing.

@pistonsDec 23.2010 — #1) set default language with javascript and create the language choice menu:

<script type="text/javascript">

var languageSwitch = "langEnglish";

</script>

<a name="langEnglish" onclick="javascript: languageSwitch='langEnglish'; switchLanguage(); return false;" style="cursor: hand;">English</a>  |  

<a name="langRussian" onclick="javascript: languageSwitch='langRussian'; switchLanguage(); return false;" style="cursor: hand;">Русский</a>  |  

2) write all languages to the page in span tags:

<span class="langEnglish" style="display:none">ENGLISH</span>
  <span class="langRussian" style="display:none">&#1056;&#1091;&#1089;&#1089;&#1082;&#1080;&#1081;</span>

3) iterate the span tags in javascript after page loads and show selected language content only:

<script type="text/javascript">
  switchLanguage();
  function switchLanguage() {
   var spans = document.getElementsByTagName("span");
   for (var i = 0; i < spans.length; i++) {
   theLanguage = spans[i].className;
   if (theLanguage != undefined) {
   if (theLanguage.indexOf("lang") != -1) {
   spans[i].style.display = 'none';
   switch (theLanguage) {
   case "langEnglish":
   if (languageSwitch == theLanguage) {
   spans[i].style.display = '';
   }
   break;
   case "langRussian":
   if (languageSwitch == theLanguage) {
   spans[i].style.display = '';
   }
   break;
   default:
   // do nothing
   } // end case of determining which language
   } // end if div contains "lang"
   } //  end if div does not define a name
   } // end for each div in document
  }

</script>

All the text for the page is stored in your repository of choice, just have the server write it all to the page and let javascript sort it out at the client side.

I welcome feedback on how to make this more efficient, thanks everyone.

@whocaresDec 29.2010 — #i also have done this multi language to my site, altho i went another way then mentionned here i copied each pages twice one being in french the other being english. u can visit it if u wish at http://yourgamingspacestation.boldlygoingnowhere.org altho i think i will be switching to the system mentionned here it seemed easier and would clean up my web server folders by a lot lol.

as far as needing a translator if u wish being a french canadian ? i could translate it for u, would appreciate some sort of pay but not obligatory

@ttbarnesauthorMar 02.2011 — #Only just seen this..

Thanks again for the great responses guys! Appreciated.

I'm looking forward to learning these techniques in the future, i'll post up any improvements I find. ?