# media-i18n

HTML custom element that resolves locale and supplies translations to descendants

## Import

```ts
import "@videojs/html/i18n";
```

One import registers both `<media-i18n>` and `<media-text>`.

`<media-i18n>` applies the i18n provider mixin to a subtree. Wrap a player, standalone controls, or one of several players that need different locales with this element. Without it, HTML controls use English defaults.

Set `lang` on the provider or an ancestor. Built-in packs lazy-load automatically; register locale strings with [`registerI18n`](https://videojs.org/docs/framework/html/reference/api/register-i18n) when you need custom copy or synchronous first paint. See [Translation phrases](https://videojs.org/docs/framework/html/reference/api/translation-phrases) for supported keys.

```html
<script type="module">
  import '@videojs/html/i18n';
  import '@videojs/html/i18n/locales/es/register';
</script>

<media-i18n lang="es">
  <media-text token="buttons.play">Play</media-text>
</media-i18n>
```

## Attributes

| Attribute | Description |
| --- | --- |
| `lang` | Forces the active BCP 47 locale for this subtree. Omit to inherit the nearest ancestor `[lang]`. |

## Related

- [`<media-text>`](https://videojs.org/docs/framework/html/reference/api/media-text): Renders translated text content
- [Internationalize the player](https://videojs.org/docs/framework/html/guides/internationalization)

---

HTML documentation: https://videojs.org/docs/framework/html/llms.txt
All documentation: https://videojs.org/llms.txt