# 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.

Status: Ready (Smootify 2.0)  
URL: https://www.smootify.io/docs/astro/reference/elements/country-switcher  
Updated: 2026-10-21

> [!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](https://www.smootify.io/docs/astro/reference/attributes/country-switcher) | `data-prop` | 6 |

## Loading

Its code loads only on pages that have `country-switcher`.