Auto change a language based on location

NewDisc
Visitor
1 0 0

Hi 
I used translate and adapt to translate to German and English. I want my webpage to change language based on our costumers location. I read that by December 2024 it is not possible to use geolocation anymore. 
We do have the language bottom. 

Do you have a solution how to do it without using geolocation or similar apps? 

Replies 2 (2)

LeoEcom
Shopify Partner
96 8 19

To handle language switching on your Shopify store based on customer preferences without relying on geolocation, you can implement a few strategies. Since geolocation will no longer be available, leveraging browser language settings and providing a prominent language switcher are good alternatives. Here’s how you can approach this:

1. Browser Language Detection

Use JavaScript to detect the user's browser language and redirect them to the appropriate language version of your site. This can be done without relying on geolocation services.

2. Language Switcher

Ensure that your language switcher is prominently placed and easy to use, allowing customers to manually select their preferred language.

Implementing Browser Language Detection

Here's a step-by-step guide to implement this:

Step 1: Add Language Detection Script

Add the following script to your Shopify theme. This script will detect the browser's language and redirect users to the corresponding language version of your site.

  1. Edit your theme's code:

    • Go to Online Store > Themes.
    • Click Actions > Edit Code.
  2. Add the script to your theme:

    • Open the theme.liquid file or your main layout file.
    • Add the following script inside the <head> tag:

 

<script>
  document.addEventListener("DOMContentLoaded", function() {
    const userLang = navigator.language || navigator.userLanguage;
    const preferredLang = localStorage.getItem('preferredLang');

    if (!preferredLang) {
      if (userLang.startsWith('de')) {
        window.location.href = '/de'; // Adjust to your German URL structure
      } else if (userLang.startsWith('en')) {
        window.location.href = '/en'; // Adjust to your English URL structure
      }
      localStorage.setItem('preferredLang', userLang);
    }
  });
</script>

 

 

This script checks the user's browser language and redirects them to the German or English version of your site accordingly. It also stores the user's preferred language in localStorage to avoid repeatedly redirecting them.

Build/Design/Redesign store | Shopify SEO promotion

Contact me and I will help you


Was my reply helpful? Click Like to let me know!

richbrown_staff
Shopify Staff
649 93 156

Changing language based on the customer's browser language can be done in Settings > Markets > Preferences and enabling Language Redirection. Location is not used, and we do not recommend using location as a proxy for a customer's language.

To learn more visit the Shopify Help Center or the Community Blog.