Language selector on Mobile

Start a Business
1

Hi there,

I want my language/currency selector at the top of my store while on mobile. Its now hidden in a burger menu.

I think i use the theme flora! And i use geolocations :slightly_smiling_face:

Help would be great

2

Hi @svduren

I totally get why you’d want your language and currency selector to be more visible on mobile. When it’s tucked away in the burger menu, customers might not even realize it’s there, which can be frustrating for international shoppers.

Since you’re using the Flora theme and have Geolocation enabled, you’ll need to move the selector from the menu and place it somewhere more accessible, like the header. Here’s how you can do it:

Solution: Move the Language/Currency Selector to the Header on Mobile

You’ll need to modify your theme.liquid file or your header.liquid file (depending on how your theme is structured). Here’s a step-by-step:

1. Locate the Geolocation Selector Code- Go to Online Store > Themes > Actions > Edit Code.

  • Find the header.liquid file (or theme.liquid if it’s in there instead).
  • Look for something like this:

{% form ‘localization’ %}

{% endform %}

2. Move This Code into the Header- If you see this inside a or menu structure, cut it out and place it above the menu within the header div.

  • If you want it right at the top, wrap it inside a div and style it to show on mobile.

3. Adjust the CSS for Mobile View

Since the default Shopify Geolocation app hides the selector inside the burger menu, you’ll want to make sure it’s visible in the header:

@media screen and (max-width: 768px) {

.header__localization {

display: flex !important; /* Ensures visibility */

justify-content: center;

gap: 10px;

padding: 5px;

}

.header__localization select {

font-size: 14px;

padding: 5px;

border: 1px solid #ddd;

border-radius: 5px;

}

}

4. Save and Test- After making these changes, save the file and check your store on mobile.

  • If it’s not appearing, try clearing your theme’s cache or testing in an incognito window.

This should move your language and currency selector to the top of the mobile view while keeping it functional. If you’re using a third-party Geolocation app, the process may differ slightly, but this works for Shopify’s built-in settings.

If you need extra help, just let me know asap. Thanks
Daisy.

3

Hello , Can you help with clarity ? seems more complicated than the other themes I’ve been trying for hours Now but nOTHING seems to work

4

I’m using Localize app for translation