# 主题设置概述

> Shoplazza 主题的设置在 theme、section、block 三个级别如何工作、在哪里定义，以及 Liquid 怎样读取商家选择的值。

为了让商家更方便地自定义您的 theme，您可以使用 JSON 创建商家可以通过[主题编辑器](https://helpcenter.shoplazza.com/hc/en-us/articles/4411401758233-Store-Customization#store-customization-0-0)访问的设置。

您可以在 theme、section 或 block 级别提供设置。设置可以是固定的（例如信息展示元素）或交互式的（例如下拉菜单）。设置值可以是静态的，也可以使用[动态数据源](./dynamic-sources)来渲染与上下文相关的值。

开放设置功能可以使您的 theme 更具可定制性，从而更好地呈现商家的品牌。同时也能让您的 theme 更灵活，以适应各种商家的不同使用场景。

## 子类型

设置分为两类：

| 类别                                                      | 描述                                                                                                                           |
| :-------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------- |
| [输入设置](./input-settings)           | 可以保存值的设置，可由应用用户配置。                                                                                           |
| [Sidebar 设置](./sidebar-settings)     | 不保存值的设置，不可由应用用户配置。这些是信息展示元素，可为输入设置提供说明和补充信息。                                       |

## 位置

您可以在以下位置创建设置：

* `config` > [settings\_schema.json](../config/settings-schema-json)
* `sections` 文件夹中的 section 文件，可以使用 [section 的 \{% schema %} tag](/docs/theme/architecture/settings/overview#section-schema)

```text title="目录"
└── theme
    ├── config
    |   ├── settings_schema.json
    |   ...
    ├── sections
    |   ├── product_detail.liquid
    |   ├── collection_detail.liquid
    |   ...
    ...
```

### settings\_schema.json

[settings\_schema.json](../config/settings-schema-json) 文件控制主题编辑器中**主题设置**区域的内容。该文件中的设置对应全局主题设置，可通过 Liquid [settings 对象](/docs/theme/references/liquid/objects/settings)访问。

### Section schema

Section 的 `{% schema %}` tag 用于创建 [section 设置](../sections/section-schema#settings)和 [block 设置](../sections/section-schema#blocks)。这些设置分别通过 [section 对象](/docs/theme/references/liquid/objects/sections)和 [block 对象](/docs/theme/references/liquid/objects/blocks)的 `settings` 属性访问。

## Schema

设置以 JSON 的 `settings` 属性形式定义，作为其适用对象的子属性。该属性接受一个设置数组。

```json title="基础设置示例"
{
  ...
  "settings": [
    {
      "type": "checkbox",
      "id": "show_thumb_mb",
      "label": {
        "zh-CN": "开启移动端缩略图",
        "en-US": "Enable mobile thumbnails"
      },
      "default": true
    },
    {
      "type": "checkbox",
      "id": "zoom_on",
      "label": {
        "zh-CN": "悬停放大图片",
        "en-US": "Hover to zoom image"
      },
      "info": {
        "zh-CN": "仅在桌面端悬停图片时有效",
        "en-US": "Only works when hovering images on desktop"
      },
      "default": false
    },
  ]
  ...
}
```

## 使用说明

使用设置时，您应该熟悉以下内容：

* [访问设置值](/docs/theme/architecture/settings/overview#访问设置)
* [检查设置值格式](/docs/theme/architecture/settings/overview#检查设置值格式)
* [为设置使用动态数据源](/docs/theme/architecture/settings/overview#动态数据源)
* [平台控制的设置](/docs/theme/architecture/settings/overview#平台控制的设置)

### 访问设置

根据创建位置的不同，您可以通过以下 Liquid 对象访问设置：

* [全局 settings 对象](/docs/theme/references/liquid/objects/settings)
* [section 对象](/docs/theme/references/liquid/objects/sections)
* [block 对象](/docs/theme/references/liquid/objects/blocks)

要访问特定设置，请将该设置的 `id` 属性追加到对应的对象后面。

例如，假设您在各 Liquid 对象中都实现了以下设置：

```json title="设置"
{
  "type": "text",
  "id": "title",
  "label": "Title",
  "default": "Featured"
}
```

那么以下 Liquid 代码将生成如下输出：

```liquid title="输入"
<!-- 设置 -->
Title: {{ settings.title }}

<!-- Section -->
Title: {{ section.settings.title }}

<!-- Block -->
Title: {{ block.settings.title }}
```

```html title="输出"
<!-- 设置 -->
Title: Featured

<!-- Section -->
Title: Featured

<!-- Block -->
Title: Featured
```

### 检查设置值格式

在引用设置时，您应始终验证值是否符合预期格式。没有自动默认值的设置可能没有值，这将转换为空[字符串](/docs/theme/references/liquid/basics/liquid-types#string)。

例如，如果您有一个 `id` 为 `title` 的设置，以下 Liquid 代码将根据值的不同生成以下输出：

```liquid title="输入"
<!-- 无值 -->
Title: {{ settings.title }}

<!-- 有值 -->
Title: {{ settings.title }}
```

```html title="输出"
<!-- 无值 -->
Title:

<!-- 有值 -->
Title: Featured
```

您可以使用 `blank` 运算符检查值是否为空字符串。例如：

```liquid title="代码"
{% unless settings.title == blank %}
  {{ settings.title }}
{% endunless %}
```

#### 基于资源的设置

为避免出现空字符串，请检查值是否符合预期格式。可能出现的情况包括：未选择任何资源、所选资源已不存在，或所选资源已被隐藏。

例如，如果您有以下 `page` 类型设置：

```json title="设置"
{
  "type": "page",
  "id": "page",
  "label": "Page"
}
```

您可以按如下方式检查空值：

```liquid title="代码"
{% if section.settings.page != blank %}
  {{ section.settings.page.title }}
  {{ section.settings.page.url }}
{% else %}
  No page, or invalid page, selected.
{% endif %}
```

### 动态数据源

包含在 [Liquid template](../templates/liquid-templates) 中的 section 和 block 的设置，可以为商家提供连接一个或多个动态数据源的选项，具体取决于设置类型。

[了解更多关于动态数据源的内容](./dynamic-sources)。

### 平台控制的设置

在主题编辑器中，Shoplazza 在 theme 级别提供了自定义 CSS 设置。