Skip to Content
Markets

Markets

If you sell across multiple countries or in multiple currencies, this guide walks through how Mercer surfaces Shopify Markets to your customers.

This guide assumes you’ve already set up Markets in your Shopify admin under Settings → Markets. Mercer reads from localization.country, localization.language, and localization.available_countries — all standard Shopify objects. If your store is single-market, you can skip this guide; nothing in Mercer requires Markets to be configured.

Three switcher patterns + a country gate

Mercer offers three patterns for the switcher (where the customer can manually change country / language) plus an optional first-visit country gate (a dismissible toast that asks on the first page load).

PatternWhere it livesWhen to use
DropdownHeader, top-rightUp to ~8 markets.
ModalHeader link opens a full modal10+ markets, or to surface full country names
FooterFooter link only — no header chromeEditorial / luxe stores wanting clean header
Country gateFirst-visit toast, dismissibleOptional, off by default. Toggle separately.

You set the pattern in Theme settings → Markets → Switcher style. The four options are Dropdown, Modal, Footer only, and Off. The shipped default is Dropdown, so a header switcher appears automatically once there’s something to switch — 2+ countries or 2+ published languages (a single-country store with multiple languages shows the language picker only). Switch to Modal, Footer only, or Off if you prefer.

The header shows a small ISO·currency chip in the top-right (e.g. “US · USD”). Clicking it expands a dropdown with country and language pickers. Best for stores with up to 8 markets where customers know where they want to shop.

The header shows the same ISO·currency chip as the Dropdown variant (e.g. “US · USD”). Clicking opens a centered modal with a country <select> and a language <select>, plus a quick-pick grid of up to eight countries — each tile showing the country name and its currency (ISO code + symbol). The country list is a flat, alphabetized set, not grouped by region. Best for catalogs with 10+ markets or where you want to surface full country names without crowding the header.

Removes the switcher from the header entirely. Adds a small switcher to the footer. Best for editorial / luxury stores that want a minimal header.

Mobile / tablet inline drawer

On mobile and tablet viewports the switcher also appears as an inline drawer inside the mega-menu. There’s no separate setting for it — it follows the active switcher pattern and is suppressed along with the others when Switcher style is set to Off.

Country gate

Independent of the switcher pattern. When enabled, the first-time visitor sees a dismissible suggestion toast (not a centered modal) with generic copy:

It looks like you’re in {country}. Switch to view available prices, taxes, and delivery options.

The detected country / currency name is filled in at runtime; the copy is not hardcoded to any specific country or currency.

Two buttons: Take me there (switches localization to the suggestion — the detected country + market currency, or just the language for a language-only suggestion) and Stay here (soft-dismisses the toast). A separate Don’t ask again on this device checkbox controls how long the dismissal is remembered. Dismissals are stored in localStorage: a soft dismiss (the X or Stay here) is remembered for 1 day; opting in to the checkbox remembers the choice for 365 days.

The gate also handles a language-only suggestion. The toast only renders on stores with 2+ published countries, but within that, if a visitor’s detected country already matches the active one and only their detected language differs, the same toast appears with “View this store in {language}” framing — suggesting the language instead of a country. The country-change and language-change cases share the toast and the same two buttons.

Mercer detects the visitor’s country client-side via Shopify’s /browsing_context_suggestions.json browsing-context endpoint (which is itself IP-resolved server-side). No third-party geolocation is used. The toast does not appear if:

  • The visitor has already dismissed it (dismissal recorded in localStorage).
  • The detected country and language both match the active market (nothing to suggest).
  • No localization options are configured for the detected country (so the switch would be a no-op).

To enable: Theme settings → Markets → Country selection prompt.

Pricing pattern

Mercer renders prices in the active country’s currency. Two patterns control how non-USD prices are formatted:

PatternBehavior
Local only (default)Uses each market’s locale formatting. e.g. “$1,234.00” / “1.234,00 €” / “¥1,234”.
Round-up disclosureDoes not change the numeric price. The money filter renders the converted price unchanged, and a small Rounded for {{ currency }} disclosure label is shown next to converted prices when the active currency differs from the primary. (Liquid can’t expose the pre-conversion amount, so no real rounding or strikethrough is possible.)

Toggle in Theme settings → Markets → Price localization pattern. Most stores should leave this on Local only. Round-up disclosure is for stores that prefer “clean” prices in display currencies.

Hreflang

Mercer emits its own <link rel="alternate" hreflang="..." href="..." /> tags in the <head> only on single-country, multi-language stores. This signals to search engines which content is the canonical version per language. No merchant action required; hreflang renders automatically when a single-country store has more than one language configured.

On multi-market stores (more than one available country), Mercer intentionally does not emit its own hreflang tags — Shopify injects the alternates at the edge in that case, and Mercer skips its own output to avoid duplicating them.

If you want to verify hreflang is rendering, view the page source on any page and search for hreflang. You should see one tag per configured language plus an x-default tag.

Right-to-left (RTL) support

The <html dir> attribute flips to rtl automatically for any right-to-left script the theme recognizes — ar, he, fa, ur, ps, sd, ug, yi, and dv (ar and he being the common examples). All other locales keep dir="ltr".

Mercer’s CSS uses logical properties throughout (inline-start, inline-end, margin-inline-*, and related properties), so page layout mirrors without a separate RTL stylesheet. Drawer and off-canvas motion for cart, mega-menu, and filter sheet surfaces is explicitly RTL-aware.

PDP gallery arrow keys and horizontal scrollers also respect direction: left / right behavior inverts under RTL so keyboard and button navigation match the visual reading direction.

RTL visual QA requires an ar or he storefront locale published on a store. The CSS and JS scaffolding is in place; the bundled EU language packs listed below are LTR.

EU language packs

Mercer ships locale files for French (fr), German (de), Italian (it), and Spanish (es) alongside the default English. Each locale includes storefront strings (fr.json, de.json, it.json, es.json) and Theme Editor strings (fr.schema.json, de.schema.json, it.schema.json, es.schema.json).

To activate a language, add it under Settings → Languages in Shopify admin. Mercer reads Shopify’s active language; no theme setting is required.

Important: the bundled translations are starter locale packs intended as a reviewed starting point. Before public-facing production use, have a native-speaker copy editor review market-specific copy. Mercer prioritized key completeness and placeholder integrity — every {{ price }}, {{ count }}, and similar token is preserved byte-identically — over final translation polish.

Pluralization sub-keys (one / other) are preserved per locale. HTML-bearing values keep their tags.

Anywhere Mercer renders an internal link, the link is automatically prefixed with the active country / language path (e.g. /de-de/products/...). You don’t have to do anything; Mercer’s localized-href snippet handles this for every section, block, and template that emits a URL.

This includes:

  • Navigation menu links
  • Cart drawer “View cart” / “Checkout” buttons
  • Featured collection CTAs
  • Product card “View product” overlay links
  • All buttons in image-with-text and multi-column blocks
  • Custom Liquid blocks (when using link.url instead of hard-coded /products/...).

If you hard-code a path like /products/wool-trench in a Custom Liquid block, that path will not be auto-localized. Use the linklists.<handle> or link.url Liquid drops where possible.

Common Markets pitfalls

”My switcher doesn’t show”

Three things to check:

  1. Theme settings → Markets → Switcher style — has it been changed to Off? (The default is Dropdown.)
  2. Settings → Markets → Markets list in the Shopify admin — is there something to switch to? The switcher renders once you have 2+ countries or 2+ published languages. A single-country, single-language store has nothing to switch to, so no switcher renders. (A single-country store with multiple languages still shows the switcher — the language picker only.)
  3. If you have multiple markets but only one has the same currency and language as the active one, the switcher only shows the options that meaningfully differ. This is a Shopify-side filter, not a Mercer one.

”My country gate isn’t appearing”

The country gate only appears once per visitor (the dismissal is set in localStorage — 1 day for a soft dismiss, or 365 days if the visitor ticked Don’t ask again on this device). If you’ve already seen it, clear localStorage for your storefront URL or browse in incognito.

It also doesn’t appear if the detected country has no configured market — the switch would be a no-op.

”Prices show in the wrong currency”

This is usually a Markets configuration issue, not a Mercer one. Check:

  • Settings → Markets — is the visitor’s country in an active market?
  • The market’s Pricing → Local pricing — is the currency you expect set as the local currency?
  • The market’s Catalogs — is the product included?

Mercer renders whatever Shopify reports as the active price.

”My country gate switches the customer but the page doesn’t reload”

The country gate uses Shopify’s standard localization form to switch. On submit, Shopify redirects to the same page with the new localization applied. If your customer’s browser is blocking form-submit redirects (rare), the page won’t reload — but this is out of Mercer’s control. The switch itself takes effect; the next navigation reflects it.

What’s next

Last updated on