# General Translation Integrations: Gestión de la configuración regional en Shopify Hydrogen
URL: https://generaltranslation.com/es/docs/integrations/shopify/reference/locale-handling.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: Cómo una tienda en línea de Shopify mantiene en una misma configuración regional los textos de la tienda en línea, el contenido del catálogo, las URL y los mercados. Referencia sobre la gestión de la configuración regional en tiendas en línea de Shopify.

Estas reglas se aplican a todas las tiendas en línea Hydrogen, ya usen React Router o Next.js. Garantizan que `gt-react` o `gt-next`, el contexto de la Storefront API de Shopify, el enrutamiento y el almacenamiento en caché usen la misma configuración regional en cada solicitud.

## Descripción general [#overview]

| Tema                                               | Descripción                                                                                                              |
| -------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ |
| [Códigos de configuración regional](#locale-codes) | Una única lista de configuraciones regionales, asignada explícitamente a los códigos de Shopify.                         |
| [Enrutamiento](#routing)                           | La URL determina el idioma, con una única URL canónica por página.                                                       |
| [Idioma y mercado](#language-market)               | El idioma del texto y el país de venta son entradas independientes que puedes combinar para cada configuración regional. |
| [Páginas en caché](#cached-pages)                  | Las traducciones se incluyen en la compilación.                                                                          |

## Códigos de configuración regional [#locale-codes]

Define las configuraciones regionales una sola vez, en `gt.config.json`. Obtén a partir de esa lista el enrutamiento, `<html lang>`, el proveedor, el selector de idioma y el contexto de las consultas de Shopify, en lugar de mantener una segunda lista.

En una tienda en línea de Shopify, cada idioma tiene tres códigos:

* **Las configuraciones regionales de General Translation** son etiquetas BCP 47, como `fr` o `pt-BR`. (Consulta [Códigos de configuración regional](/docs/platform/core/guides/locale-codes)).
* **Los valores `LanguageCode` de la Storefront API** son enumeraciones en mayúsculas con guiones bajos, como `FR` o `PT_BR`. Pásalos a `@inContext(language:)`.
* **Las configuraciones regionales de la Admin API** son los códigos de configuración regional de la tienda, como `fr` o `pt-BR`. Pásalos a `translationsRegister`.

Mapea cada configuración regional de forma explícita. Reemplazar `_` por `-` funciona con la mayoría de los códigos, pero no con todos:

| `LanguageCode` de Shopify | Idioma               | Configuración regional de General Translation |
| ------------------------- | -------------------- | --------------------------------------------- |
| `EN`                      | Inglés               | `en`                                          |
| `FR`                      | Francés              | `fr`                                          |
| `JA`                      | Japonés              | `ja`                                          |
| `PT_BR`                   | Portugués (Brasil)   | `pt-BR`                                       |
| `PT_PT`                   | Portugués (Portugal) | `pt-PT`                                       |
| `ZH_CN`                   | Chino (simplificado) | `zh-CN` o `zh-Hans`                           |
| `ZH_TW`                   | Chino (tradicional)  | `zh-TW` o `zh-Hant`                           |

`ZH_CN` y `ZH_TW` designan un sistema de escritura, no solo una región. Además, `zh-TW` implica Taiwán, mientras que `zh-Hant` se refiere al chino tradicional en cualquier región. Elige una configuración regional para cada idioma de Shopify y úsala en `gt.config.json`, en las URL y en `<html lang>`.

<Callout type="info">
  **Próximamente en Hydrogen:** hay pull requests abiertos que proponen funciones auxiliares para configuraciones regionales. [Shopify/hydrogen#4009](https://github.com/Shopify/hydrogen/pull/4009) añade `defineShopifyI18n`, una definición de configuraciones regionales con enrutamiento por ruta o por dominio, y funciones auxiliares como `getSupportedLocales`. [Shopify/hydrogen#4325](https://github.com/Shopify/hydrogen/pull/4325) añade `getHtmlLang`, que convierte un `LanguageCode` en una etiqueta `<html lang>` válida; por ejemplo, `PT_BR` en `pt-BR` y `ZH_TW` en `zh-Hant`. Ninguna de las dos está incluida todavía en una versión publicada de `@shopify/hydrogen`, así que mantén tu propia lista de configuraciones regionales y tu propio mapeo.
</Callout>

Genera las etiquetas solo a partir del idioma. Un comprador del mercado canadiense que lee en francés recibe `fr`, no `fr-CA`. Añade una configuración regional independiente, como `fr-CA`, solo si mantienes textos específicos para ella.

## Enrutamiento [#routing]

### La URL determina el idioma

Resuelve la configuración regional a partir de la ruta o el dominio de la solicitud, y pasa ese mismo valor al proveedor, a `<html lang>` y al contexto de consulta de Shopify. Una cookie o el encabezado `Accept-Language` pueden sugerir una redirección, pero una misma URL siempre renderiza el mismo idioma, de modo que las cachés y los motores de búsqueda ven un único idioma por URL.

### Una URL canónica por página

Sirve la configuración regional predeterminada sin prefijo y las demás configuraciones regionales con un prefijo, por ejemplo, `/fr/products/hoodie`. Devuelve un 404 si la configuración regional predeterminada lleva prefijo, por ejemplo, `/en/products/hoodie`, y también para prefijos desconocidos. Los enlaces renderizados en una página localizada conservan su prefijo.

Pasa el prefijo a Hydrogen como `i18n.pathPrefix` en `createShopifyRequestContext` (por ejemplo, `/fr`) o una cadena vacía para la configuración regional predeterminada. Hydrogen lo añade a las redirecciones que devuelve, tanto las de variantes de producto como las de rutas estándar.

### Rutas no localizadas

Deja sin prefijo las rutas que Shopify o sus scripts invocan en rutas fijas: los manejadores de solicitud de las API de carrito y de búsqueda predictiva, los callbacks de autorización de cuentas de cliente y otras rutas `/api`. En la plantilla de Vercel Shop, `proxy.ts` permite que `handleShopifyRoutes` de Hydrogen responda a estas solicitudes antes de cualquier reescritura de configuración regional. (Consulta [Localizar una tienda en línea de Shopify con Next.js](/docs/integrations/shopify/guides/localizing-nextjs#routing)).

Las solicitudes de carrito y de búsqueda predictiva siguen necesitando el idioma de la página; de lo contrario, Shopify devuelve el texto del catálogo en el idioma predeterminado. Guarda la configuración regional de la página en una cookie, léela solo para estas solicitudes sin prefijo y acepta únicamente las configuraciones regionales definidas en la configuración. (Consulta [Mantener los manejadores de solicitud de Hydrogen en el idioma de la página](/docs/integrations/shopify/guides/localizing-react-router#handler-locale)).

## Idioma y mercado [#language-market]

La directiva `@inContext` de la Storefront API recibe un `language` y un `country`. Cada uno responde a una pregunta distinta:

* **`language`** determina qué traducción del contenido del catálogo devuelve Shopify. Sigue la configuración regional de la página.
* **`country`** determina el mercado, que fija los precios, la divisa y la disponibilidad de los productos. En un carrito, solo se aplica mientras el carrito no tenga una identidad de comprador, y nunca la establece. Establece el país del comprador mediante `cartCreate` o `cartBuyerIdentityUpdate`; a partir de ese momento, la identidad del comprador prevalece sobre los valores de `@inContext` que entren en conflicto. (Consulta las [reglas de contexto del carrito](https://shopify.dev/docs/storefronts/headless/building-with-the-storefront-api/in-context#cart-queries-and-mutations) de Shopify).

Elige cómo se relacionan:

* **Un mercado para todos los idiomas.** Pasa el mismo país para todas las configuraciones regionales. Cambiar de idioma solo modifica los textos y el contenido del catálogo, nunca los precios ni el carrito.
* **Un mercado por idioma.** Asocia cada configuración regional a un país (por ejemplo, francés a Francia y japonés a Japón) y pasa ese país junto con el idioma de la configuración regional. Así, cada idioma muestra los precios y la divisa de su mercado. Cuando cambie el idioma, actualiza el `countryCode` del comprador del carrito con `cartBuyerIdentityUpdate`, ya que un carrito conserva la divisa del país de su comprador. (Consulta [Vender en varios mercados](/docs/integrations/shopify/guides/selling-in-markets)).

Si quieres que los compradores elijan el país con independencia del idioma, añade en su lugar un selector de país aparte y actualiza la identidad del comprador cada vez que cambie.

Nunca conviertas precios ni deduzcas una divisa a partir de la configuración regional. Da formato a los importes de Shopify con el código de divisa ISO 4217 que devuelve Shopify, usando [`<Currency>`](/docs/react/reference/components/currency) o `formatMoney` de Hydrogen.

## Páginas en caché [#cached-pages]

Carga las traducciones desde archivos incluidos en el paquete de la compilación cuando las páginas estén en caché o se prerendericen. Las solicitudes de traducción en tiempo de ejecución no pueden ejecutarse dentro de un shell estático. En Next.js con Cache Components, es obligatorio usar un [`loadTranslations`](/docs/react/reference/functions/load-translations) personalizado. (Consulta [Uso de Cache Components](/docs/react/nextjs/cache-components)).

Las traducciones del catálogo almacenadas en Shopify no forman parte de la compilación, sino que se rigen por la configuración de caché de tu Storefront API.

## Sitemap

See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.