Move Geolocation Currency Selector to Top of Website

Shopify Apps
1

Hello, my client is using the Geolocation app on their website using a customized Prestige theme. Geolocation comes with a currency selector at the footer. We would like to move it to the top of the website if at all possible. I noticed the selector itself is wrapped in a

that has no ID or class name. Is there any way to edit the app codes so we can add an ID or class name to this
so we can move it using CSS?

I tried reaching out to support but they just directed me to contact the theme (which has nothing to do with the app) or advised me not to make the change.

If anyone has any experience with changing the Geolocation currency selector outside of its default footer position, would love to know how you did it. Thank you!

2

I’m in the same boat. I’ll update if I find anything.

3

Hey @Wallace7C , there are no settings in the app to move the selects wherever you want.
You need to use custom code and utilize the Localization object (Liquid objects: localization (shopify.dev)), which Shopify provides. Here is an article about how they implement it: Support multiple currencies and languages (shopify.dev)

Here is my simple solution with simple selects:

{% if localization.available_countries.size > 1 or localization.available_languages.size > 1 %}
  {% form 'localization' %}
    {% if localization.available_countries.size > 1 %}
      
    {% endif %}

    {% if localization.available_languages.size > 1 %}
      
    {% endif %}
  {% endform %}
{% endif %}

And the script code to make submit the form on selecting an option:
4

Hi I’m trying to the same thing as I just installed the app. It makes no sense to me that the selector would be at the bottom of the page instead of at the top (where customers can actually see and utilize it). Did you ever figure out how to move it to the top?

5

Did you ever figure out how to move the Geolocation currency selector to the top?

6

Hey @Maya9 , have you tried the answer above?
It works for us, though.
Here is a screenshot from it:

RadoslavValchev_0-1690872419531.png
RadoslavValchev_0-1690872419531.png734×182 6.29 KB

In the end, we decided that it is best to have both selects in a modal, so currently, this button with the current language flag opens a modal with both selects - country, and language.

7

I have 2 headers desktop and mobile, i tried using the media query but it doesn’t work, any work around?

Thank you

8

Hi,

Where do these two pieces of your code go? Is this a separate solution or something to be done on top of installing Geolocation app?