---
title: "Localization"
description: "Choose a buyer locale, override product copy, and understand language fallback and money formatting."
---

> Documentation Index
> Fetch the complete documentation index at: https://docs.seatlayer.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Localization

Buyer surfaces ship with English, Spanish, German, and French. Pass a locale
when your application already knows the buyer's language, or allow the SDK to
resolve it from the buyer's saved choice and browser.

```js title="buyer/localization.js"
const picker = new seatlayer.SeatPicker({
  container: "#picker",
  event: "ev_9f3a",
  locale: "de-DE",
  messages: {
    "map.fromPrice": "ab {price}",
    "picker.holdSeats": "Weiter zur Kasse",
  },
});

await picker.render();
```

## Locale resolution

SeatLayer resolves language in this order:

1. explicit `locale`;
2. the buyer's stored language preference;
3. `navigator.language`;
4. English.

Regional BCP 47 tags resolve by base language, so `es-MX` uses Spanish and
`fr-CA` uses French. Unsupported languages fall back to English.

English is included with the main SDK. Other built-in language bundles load on
demand, and `render()` resolves after the selected language is ready.

## Override individual messages

`messages` is a sparse map layered over the active locale. Use it for
white-label product language, not for rendering untrusted user input.

```js title="buyer/copy.js"
const messages = {
  "picker.completeBooking": "Confirm tickets",
  "picker.holdExpired":
    "Your reservation expired. Choose your seats again.",
  "picker.seats.one": "{count} ticket",
  "picker.seats.other": "{count} tickets",
};
```

Placeholders such as `{count}`, `{price}`, and `{label}` are interpolated by the
SDK. Pluralized strings use `.one` and `.other` variants. If a key is absent,
SeatLayer falls back to the selected locale, then English, then the key itself.

> **Keep overrides small**
>
> Override the language your product owns and rely on the shipped dictionary
> for standard seating behavior. A small override set is easier to review when
> the SDK adds a new state.

## Common keys

| Key | English purpose |
|---|---|
| `map.aria` | Seating-map screen-reader instructions |
| `map.seatsLeft` | Remaining inventory label |
| `map.fromPrice` | Starting-price label |
| `picker.holdSeats` | Main hold and checkout action |
| `picker.completeBooking` | Direct-booking action |
| `picker.seatsHeld` | Hold countdown state |
| `picker.holdExpired` | Expired-hold recovery |
| `picker.seatTaken` | Concurrent-selection conflict |
| `picker.language` | Language selector label |
| `picker.zoomToFit` | Map navigation control |
| `picker.categories` | Category filter heading |
| `picker.accessibility` | Accessibility filter heading |
| `picker.colorblind` | Colorblind-safe palette control |
| `picker.yourSeats` | Selection summary |
| `picker.total` | Buyer total |
| `picker.bookButton.one` / `.other` | Quantity-aware final action |

Use the exported SDK types and current dictionary as the exact reference when
maintaining a comprehensive custom translation.

## Locale and currency

Locale changes number formatting, separator placement, dates, and plural rules.
It does not convert prices or choose the order currency. Currency resolves
independently from event/org data, the SDK fallback, and USD.

```js title="buyer/french-euros.js"
new seatlayer.SeatingChart({
  container: "#chart",
  event: "ev_9f3a",
  locale: "fr",
  currency: "EUR", // fallback only when the event carries no currency
});
```

## Localization review

- [ ] Every explicit locale has a supported fallback.
- [ ] Overrides preserve required placeholders.
- [ ] Singular and plural actions read naturally.
- [ ] Long German and French labels fit on a narrow screen.
- [ ] Screen-reader instructions match the actual controls.
- [ ] Price formatting is tested separately from the price source.

Continue to [currency and pricing](/customization/currency-and-pricing) or the
[SeatingChart reference](/buyer-sdk/seating-chart).

Source: https://docs.seatlayer.io/customization/localization/index.mdx