Cómo el widget resuelve su idioma y skin

El widget que incrustas tiene dos capas: el shell (la chrome de Caputchin, su checkbox o franja de marca, su texto y colores) y, cuando usas un juego, el juego dentro de él. Cada uno tiene un idioma y un skin, y el widget resuelve ambos en el servidor cuando carga. Esta página explica cómo se resuelve el shell, y cómo se alinea con el juego para que los dos nunca choquen.

Para personalizar el propio idioma, skin y configuración de un juego, mira personalización de juego. Esta página es sobre el shell.

Qué trae el shell

El shell es totalmente autocontenido. Incluye sus cadenas de interfaz en cada idioma oficial y tanto una paleta clara como una oscura, así que siempre tiene algo correcto que renderizar incluso sin personalización y sin red. Reemplazar esas cadenas, colores o enlaces incluidos es white-labeling, una función de nivel Apex; la resolución de abajo es la misma tengas o no overrides.

Cómo el shell elige un idioma

Cuando el widget carga decide qué idioma pedir al servidor, en este orden:

1. El atributo locale del widget, si la página fijó uno (una elección explícita).
2. Si no, el idioma del navegador del visitante.

El servidor resuelve entonces eso contra los idiomas del shell (tus overrides primero, luego el conjunto incluido): una coincidencia exacta, luego el idioma base, luego el default del shell, luego su primer idioma. Así que el shell siempre renderiza texto real.

Cómo el shell elige un skin

Misma forma para el skin:

1. El atributo skin del widget, si la página fijó uno: light, dark, o un nombre de preset.
2. Si no, la preferencia de sistema del visitante (prefers-color-scheme).

El servidor resuelve eso a una paleta concreta clara u oscura (tus overrides primero, luego incluidos). Cada preset declara el modo en el que funciona; un preset cuyo modo es any se lee sobre cualquier fondo y por tanto es elegible para ambos. El shell trae una paleta clara y una oscura de fábrica, y el skin resuelto siempre reporta un modo concreto claro u oscuro, que es lo que la chrome renderiza.

Cómo el shell sigue al juego

Aquí está la parte que lo ata todo. Cuando hay un juego montado, el shell no resuelve su idioma y skin de la señal del visitante directamente. En su lugar sigue al juego: el widget resuelve el juego primero, luego usa el idioma resuelto y el modo claro u oscuro del juego como entrada del shell.

Así que si el navegador de un visitante es francés y el juego resuelve a francés, la chrome de alrededor se renderiza en francés también. Si el juego resuelve a su skin oscuro, la chrome se vuelve oscura para combinar. El shell recae en el propio idioma del visitante y la preferencia de sistema solo cuando no hay juego montado (el widget de checkbox simple), o cuando el juego no resolvió un idioma o skin propios.

El resultado es que el juego y la chrome a su alrededor siempre concuerdan, sin que configures el shell y el juego por separado para que combinen.

Configuración

El shell también tiene una pequeña configuración: los destinos de enlace en su franja de marca (el enlace de inicio y el enlace legal). A diferencia del idioma y el skin, esto no tiene entrada del visitante; el servidor lo resuelve de tus overrides o los valores por defecto incluidos. Cambiar esos enlaces es parte del white-labeling.

Véase también

• White-label del widget: reemplaza el texto, los colores y los enlaces del shell.
• Estila el widget con CSS: apunta a los parts del shell desde tu propia hoja de estilos.
• Personalización de juego: el propio idioma, skin y configuración del juego.