country-switcher
Lists the market's countries in a popover and changes country on a pick. The countries are the Shopify markets' (availableCountries of the localization); the locales are the site's [locales] a[hreflang] links, else the head's link[rel="alternate"][hreflang], and a pick that finds a locale for the country's ISO code (IT → the Italian page) changes the country, then the language, then goes to that page; without locales or without a matching one only the country changes and the page stays.
Note
On a site with locales, the language and market links of [locales] (the same page in the other language) are the way, since the country change alone leaves the page’s language and prices out of step.
Where it can go
- Anywhere on the page.
- Must contain one of
[popover] :is(a, button:not([popovertarget])). - Out of place, Smootify removes it from the page: when the store sells in one country (availableCountries has one entry), since there is nothing to pick.
What it requires
Nothing beyond Smootify: it works on every plan.
Attributes inside it
| Group | Attribute name | Values |
|---|---|---|
| Country switcher | data-prop | 6 |
Loading
Its code loads only on pages that have country-switcher.