- Notifications
You must be signed in to change notification settings - Fork0
JavaScript for detecting browser language and make an automatic language redirection (all on the client side)
License
alexandre1985/language-redirector
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
( this repository now lives athttps://gitlab.com/alexandre1985/language-redirector/ )
Pure JavaScript for detecting browser language and make anautomatic language redirection (all on the client side)
This javascript only makes the automatic redirection when visiting the root website (for example,www.something.com
). Or when explicitly telling so, by adding the?languageRedirection=yes
query string to the website request (for example, usingwww.something.com/NonMilkyWayLanguage?languageRedirection=yes
)
Just add this javascript to your website. Maybe<script src="lang.min.js" crossorigin="anonymous"></script>
will work 😉
Still, there is something to configure.
This javascript targets website that have the main root page (for example:www.something.com
page) with the default main language or root language. And the rest of the language pages reside onwww.something.com/lang
(for other international languages), for example:
- Portuguese in
www.someting.com
- English in
www.something.com/en
- French in
www.something.com/fr
- Japanese in
www.something.com/jp
You just set the website (that has the languages living in each path), and then set the array variablelanguagesOfWebsite
, inside the lang.js javascript, to correspond with each language path.
For example:const languagesOfWebsite = [ 'pt', 'en' ]
will have a website with thewww.something.com
in Portuguese andwww.something.com/en
in English.
As off right now, website international language pages must correspond with to the begining of each language code. For example, American English must livewww.something.com/en
because the code for American English isen-US
. The American English page mustnot live inwww.something.com/us
or something else.
For example, if the website root language is English (www.something.com
) and is translated for Brazil'sPortuguese and also Portugal'sPortuguese, the variableconst doDistinctionsOfCountriesWithTheSameLanguage
must be set fromfalse
totrue
. And with this set to true, the Portugal's Portuguese translated website must live inwww.something.com/pt-PT
and the Brazil's Portuguese website must live inwww.something.com/pt-BR
.
Also, with this example, the variablelanguagesOfWebsite
must be set asconst languagesOfWebsite = [ 'pt-PT', 'pt-BR' ]
(notice that the root language, which is English, is ommited this time).
There is the use case when you want disable the language redirection. For example, when you are on a translated international language (for example,www.something.com/jp
) of your website and want to code an anchor link tag to the root language of the website (for example, English inwww.something.com
).
In this case you want to code the anchor link tag as<a href="http://www.something.com?languageRedirection=no" ... >
(notice the addition of?languageRedirection=no
).
Why must you add this query string?
Because when you are redirecting to the root of the website (www.something.com
) this script gets activated and if the language of the browser is different than the configured root language of your website, this script will redirect the visitor to the corresponding language version of the website (for example, using a Japonese browser, clicking on a anchor link to English pagewww.something.com
will automatically redirect this visitor towww.something.com/jp
).
Add the query string?languageRedirection=yes
.
For example, using a Japonese browser, visiting the linkwww.something.com/playing/blog?languageRedirection=yes
will redirect the visitor towww.something.com/jp/playing/blog
UNLICENSE (Public Domain)
About
JavaScript for detecting browser language and make an automatic language redirection (all on the client side)