Country/region selector for Horizons theme?

Shopify Discussion
1

I can’t seem to find any way for a visitor to change their region/currency/etc in the Horizons theme. This is important so that the customer can view the correct product selections, prices, currency and offers.

In our previous Dawn theme there was a drop-down selector on every page to choose this. The only way I can find to change it in Horizons is to go through to the checkout and change the country there and then return to the store – not ideal.

Is there some option to do this already or something I’m missing? Any code snippets or blocks I can add to our theme to implement this?

Thanks!

4

Hi,

Hope this will help

  • Enable Country/Region Selector in Shopify Settings
  • Add Manual Country Selector (If Not Built-in)

Code example

<form method="post" action="{{ routes.root_url }}">
  <select name="country_code" onchange="this.form.submit()">
    {% for country in localization.available_countries %}
      <option value="{{ country.iso_code }}" {% if country.iso_code == localization.country.iso_code %}selected{% endif %}>
        {{ country.name }} ({{ country.currency.iso_code }})
      </option>
    {% endfor %}
  </select>
  <input type="hidden" name="return_to" value="{{ request.path }}">
</form>
  • Insert the Snippet in the Header
5

Thanks @Small_Task_Help and @PaulNewton – I ended up with this quick bodge of a block, which seems to work:-

{%- form 'localization', id: 'FooterCountryFormNoScript', class: 'localization-form' -%}
  <select name="country_code" onchange="this.form.submit()">
    {% for country in localization.available_countries %}
      <option value="{{ country.iso_code }}" {% if country.iso_code == localization.country.iso_code %}selected{% endif %}>
        {{ country.name }} ({{ country.currency.iso_code }})
      </option>
    {% endfor %}
  </select>
  <input type="hidden" name="return_to" value="{{ request.path }}">
{%- endform -%}

{% schema %}
{
  "name": "Country Selector",
  "settings": [],
  "presets": [
    {
      "name": "Country Selector",
      "category": "Custom"
    }
  ]
}
{% endschema %}
type or paste code here
6

If using markets or geoip etc, make sure to test as a user from regions.

7

Hi @Tristan3dt,

Please go to Customize > Sections > Header > Localization. You can enable it here

Screenshot
Screenshot766×1436 60 KB

If I helped you, then a Like would be truly appreciated.

8

So it is! Thank you <3

9

Hi @Tristan3dt,

It’s my pleasure