Re: How to automatically redirect store language

How to automatically redirect store language

VAIN
Tourist
12 0 3

Dear Community,

 

I'm currently making my store bilangual (Dutch/English) and I'm doing this with the Translation Lab app from Sherpas Design. They are currently still developing an automatic store language redirect and told me to use another app in the meantime.

 

I'm not a code expert or any of that kind, but can get most of the code work done with some help. So I end up here asking if there are apps or maybe even an easier way to add script to my code that will automatically redirect users to their own language page. In this case redirecting dutch users to the dutch page.

 

I'd like to hear if you guys know a solution for this function.

 

Greetings,

Ewald

Replies 15 (15)

MichaelGeo
Pathfinder
194 3 17

Hi!

 

You can potentially use Geo Redirect tool.

 

It can detect your visitors' locations by IP and auto direct them to correct website URLs based on their locations. For example, if your visitor is in Netherlands, and he goes to exampleshop.com, it will auto direct him to exampleshop.com?lang=Dutch. You can easily set up redirecting rules within a few steps. No code is necessary. The service will generate the Javascript code for you to add to your website. Shopify platform is perfectly supported.

 

For more details on how to set up auto redirect, you could look at the tutorial: https://geotargetly.com/guides/geo-redirect-quick-start-guide

 

Hope it helps.

VAIN
Tourist
12 0 3

In the meantime we have solved the issue with a cookie and api.

The api checks the users location and the cookie wil remember that this user has been redirected already.

We added the folowing in the beginning of our theme.js.liquid:

 

if (getCookie("language") == "") { 
  $.getJSON('https://ipapi.co/json/', function(data) {
    if(data.country_code == 'NL') {
      document.cookie = "language=NL;";
      if (!window.location.href.includes('https://vain.store/nl')){
        var url = window.location.href;
        
        
        var txt2 = url.slice(0, 19) + "nl/" + url.slice(19);
    window.location.href= txt2;
      }
  }
});
 
}
snowcoconutxx
Tourist
3 0 1

Hi Vain,

 

Do you know what code to use to always redirect to another language, without checking what country the user is located in?

 

Thanks

Kate_S
Visitor
3 0 0

Hello,

I also use a translation app, LangShop, and it has redirects feature. It can redirect visitors based on store language, visitor's browser language or visitor's country. Or it's also possible to suggest language with a popup, also a great thing.

kngfu
Tourist
4 0 13

It works technically, but not sure this solution complies with EU regulations. I don't think it is ok to set a cookie or auto redirect without a user's consent.
Does anyone have more info on this?

Viljami
Tourist
3 0 3

I managed to get it work togetger with geolocation:
1. First time user go to site, we detect user browser language and set it right
2. Later on user can switch languages if detection for some reason went wrong

Usage>
1. Just copy the following script to your theme.liquid folder in <head> section
2. Check the script supported languages variable, and update it to equal your supported language URLs
```
<script>
const YOUR_DOMAIN = window.location.origin
const YOUR_DOMAIN_LENGTH = YOUR_DOMAIN.length
const SUPPORTED_LANGUAGES = ["fi"]
const LANGUAGE_COOKIE_NAME = "language"
const BROWSER_LANGUAGE = navigator.language
function getCookie(name) {
const value = `; ${document.cookie}`;
const parts = value.split(`; ${name}=`);
if (parts.length === 2) return parts.pop().split(';').shift();
}

function setDefaultLanguage(){
let selectedLanguage = getCookie(LANGUAGE_COOKIE_NAME)
if (!selectedLanguage) {
console.log("No selected lang")
for (const lang of SUPPORTED_LANGUAGES){
console.log("Lang", lang)
if(BROWSER_LANGUAGE.includes(lang)){
document.cookie = `${LANGUAGE_COOKIE_NAME}=${lang};`;
if (!window.location.href.includes(`${YOUR_DOMAIN}/${lang}`)){
var url = window.location.href;
var redirect_url = url.slice(0, YOUR_DOMAIN_LENGTH) + `/${lang}` + url.slice(YOUR_DOMAIN_LENGTH);
console.log(url.slice(0, YOUR_DOMAIN_LENGTH))
window.location.href= redirect_url;
}
break;
}
}
}
}
setDefaultLanguage()
</script>
```



Pandora001
Excursionist
14 2 4

awesome, that's exactly what I was looking for! Can you help me adapt it ? 
I have my website in English and French. I want it to be in french when browser is set in french, and English in any other case. 
Thank you so much for your time!

Viljami
Tourist
3 0 3

So to get it work for your domain and language, it should work by doing as explained before

1. Copy the following script (check my answer before, just copy the <script> tags and code between) to your theme.liquid folder in <head> section
2. From the script, find the supported languages variable, and update it to equal your supported language (so in your case, just replace line const SUPPORTED_LANGUAGES = ["fi"] to const SUPPORTED_LANGUAGES = ["fr"])

If for some reason this not work, just contact me

Pandora001
Excursionist
14 2 4

works perfectly !! Thank you so much!!!! I've been pulling my hair out, checked countless plugins and forums and this is just perfect. 

Pandora001
Excursionist
14 2 4

One more question, if I have two other languages "fr" and "de", and same as before, I want the default to be english but french or german depending on browser language. How does the code go ?
Should I use semi-column ? 

SUPPORTED_LANGUAGES = ["fr";"de"] ?
Many thanks again

Pandora001
Excursionist
14 2 4

found it, it's a comma, not a semi-column

so "fr","de" !

stumpfmarketing
New Member
4 0 0

Hi there, thank you so much - it helped me, too!

Is it also possible to customize the code so that people with e.g. French or Italian browser language are also redirected to the English page? Unfortunately, the current situation is that only people with English as their browser language are redirected to the English website. But because we only have English (domain.com/en) and German (domain.com) as languages, we would prefer that people with other languages are also redirected to the English page.

Viljami
Tourist
3 0 3

I recommend in this situation to change your site default language to English. I also did it even if my prime market is Finland. So then your german browsers is redirected to domain.com/ge and other languages to domain.com which should be english

piqresq
Visitor
1 0 1

Wow. Thank you. Works great. You just saved me from buying this feature 😁🙏

tselehub
Visitor
3 0 1

Hi i have in my store 2 languages. The DEFAULT is greek and secondary english. I want whoever connects from Greece to do it in Greek and all other countries to be in English. How can I do it?