根据语言偏好更改网站版本

Question

I have a french and an english version of my website:
*example.com/ is my english version.
*example.com/fr/ is my french version.

So they have the possibility to change the websites version by clicking on a flag,but by default if they arrive on example.com it will be in english.

I would like to give them the version corresponding to their language preference, i detect language preference with :

var language = window.navigator.userLanguage || window.navigator.language;

But then what code do i use so that when they arrive on the webpage, it will give the version according to the user language preference ?

And if the website gives a french version but the user wants english version, still has the possiblity to change manualy.

Answer 1

You'll have to redirect them:

if (window.navigator.language === 'fr') {
    window.location.href = "http://example.com/fr/";
}

Please keep in mind that the window.navigator.language property is implemented differently across browsers and you may have to find your preferred language in an array (like window.navigator.languages).

A better option would be to check the Accept-Language header on the HTTP request on the server side, and redirect accordingly on the server side.

There are also JavaScript-based internationalization methods, but they don't normally involve redirecting the site.