---
type: explanation
title: 组件如何解析它的语言和皮肤
summary: 组件外壳如何挑它的语言和亮或暗皮肤，以及当挂载了一个游戏时那如何跟随游戏。
---

你嵌入的组件有两层：**外壳**（Caputchin 外饰、它的复选框或品牌条、它的措辞和颜色），以及当你用一个游戏时，它里面的那个 **游戏**。每一层都有一种语言和一个皮肤，组件在它加载时于服务器上解析两者。这一页解释外壳如何解析，以及它如何和游戏对齐、好让两者绝不冲突。

要自定义一个游戏自己的语言、皮肤和配置，见 [游戏自定义](/docs/game-customization/overview)。这一页讲的是外壳。

## 外壳交付什么

外壳是完全自包含的。它把它的界面字符串以每种官方语言、以及一套亮和一套暗调色板捆绑在内，于是即便没有自定义、没有网络，它也总有正确的东西可渲染。替换那些捆绑的字符串、颜色或链接就是 [白标](/docs/widget-customization/white-label)，一个 Apex 档的功能；下面的解析无论你有没有覆盖都一样。

## 外壳如何挑一种语言

当组件加载时，它按这个顺序决定向服务器请求哪种语言：

1. 组件的 `locale` 属性，如果页面设了一个（一个明确的选择）。
2. 否则，访客的浏览器语言。

服务器随后把那个与外壳的语言匹配（你的覆盖在先，然后是捆绑集合）：一个精确匹配、然后基础语言、然后外壳的默认、然后它的第一种语言。所以外壳总是渲染出真实的措辞。

## 外壳如何挑一个皮肤

皮肤同样的形状：

1. 组件的 `skin` 属性，如果页面设了一个：`light`、`dark`，或一个预设名。
2. 否则，访客的系统偏好（`prefers-color-scheme`）。

服务器把那个解析成一套具体的亮或暗调色板（你的覆盖在先，然后是捆绑的）。每个预设声明它在哪种模式下工作；一个模式为 `any` 的预设在任一背景上都好看，因而对两种模式都有资格。外壳开箱即带一套亮和一套暗调色板，而解析出的皮肤总是报告一种具体的亮或暗模式，那正是外饰所渲染的。

## 外壳如何跟随游戏

这就是把它们绑在一起的那部分。当一个游戏被挂载时，外壳不直接从访客信号解析它的语言和皮肤。相反它 **跟随游戏**：组件先解析游戏，然后用游戏解析出的语言和亮或暗模式作为外壳的输入。

所以如果一位访客的浏览器是法语、而游戏解析为法语，那么周围的外饰也以法语渲染。如果游戏解析为它的暗皮肤，外饰就转暗以相配。只有当没有游戏被挂载时（朴素的复选框组件），或者当游戏没有解析出它自己的语言或皮肤时，外壳才回退到访客自己的语言和系统偏好。

结果是游戏和它周围的外饰总是一致，而无需你分别配置外壳和游戏来相配。

## 配置

外壳还有一个小小的 **配置**：它品牌条里的链接目标（主页链接和法律链接）。不像语言和皮肤，这个没有访客输入；服务器从你的覆盖或捆绑的默认来解析它。更改那些链接是 [白标](/docs/widget-customization/white-label) 的一部分。

## 另见

- [给组件做白标](/docs/widget-customization/white-label)：替换外壳的措辞、颜色和链接。
- [用 CSS 给组件设样式](/docs/widget-customization/css-parts)：从你自己的样式表瞄准外壳的那些 part。
- [游戏自定义](/docs/game-customization/overview)：游戏自己的语言、皮肤和配置。