概述​

为了让商家更容易定制你的主题，你可以使用 JSON 创建设置项，供商家通过主题编辑器访问。

你可以在 theme、section 或 block 级别提供设置项。设置项可以是固定的（例如提示信息）或交互式的（例如下拉菜单）。设置值可以是静态的，也可以使用动态源来呈现上下文相关的值。

公开设置项可以使你的主题更具可定制性，以便更好地表达商家的品牌。它还可以使你的主题更灵活，以应对商家的各种使用场景。

配置项类型​

配置项主要有两种类型：

• 输入设置 - 可以保存值，并由商家配置的设置项。
• 侧边栏设置 - 不能保存值，不可由商家配置的设置项。它们是信息元素，用于为你的输入设置提供提示信息和分组信息。

位置​

你可以在以下位置创建设置项:

• config > settings_schema.json
• 在 sections 文件夹中的 section 文件，使用 section 的 {{#schema}} 标记

└── theme
    ├── config
    |   ├── settings_schema.json
    |   ...
    ├── sections
    |   ├── main_product.html
    |   ├── another_section_file.html
    |   ...
    ...

settings_schema.json​

settings_schema.json 文件控制主题编辑器中主题设置区域的内容。该文件中的设置项转换为全局主题设置项，可以通过 Handlebars settings 对象访问。

Section schema​

{{#schema}} helper 用于创建 section 设置和 block 设置。这些设置可以分别通过 section 对象和 block 对象的 settings 属性访问。

Schema​

设置项在 Section Schema 内可以通过 settings属性来定义一系列配置项，它是由一些配置项组成的数组。

{
  ...
  "settings": [
    {
      "type": "text",
      "id": "shopline_text",
      "label": "Example text",
      "default": "Input text"
    },
    {
      "type": "url",
      "id": "shopline_url",
      "label": "URL",
      "default": ""
    }
  ],
  ...
}

使用​

在处理配置项时，你应该熟悉以下内容：

• 翻译设置
• 访问配置项的值
• 检查配置项值的格式
• 基于资源的设置
• 使用动态源设置
• 平台控制的设置

翻译设置​

你可以根据在线商店的活动语言来翻译配置项的各种属性。这些翻译信息存储在 schema 本地化文件中。

访问配置项的值​

根据创建位置不同，可以通过以下 Handlebars 对象访问配置值：

• 全局 settings 对象
• section 对象
• block 对象

要访问特定设置，请将关联设置的 id 属性附加到你想访问的对象上。

例如，如果你在每个 Handlebars 对象中实现了以下设置:

{
  "type": "text",
  "id": "example_text",
  "label": "Text",
  "default": "Default text."
}

然后以下 Handlebars 将生成以下输出:

// Settings
Text: {{ settings.example_text }}
// Section
Text: {{ section.settings.example_text }}
// Block
Text: {{ block.settings.example_text }}

输出结果：

// Settings
Text: Default text.
// Section
Text: Default text.
// Block
Text: Default text.

检查配置项值的格式​

在引用 settings 时，应始终检查值是否符合你预期的格式。任何没有自动默认值的设置可能最终没有值，这将导致空字符串。

例如，如果你有一个 id 为 example_text 的设置，那么根据值，以下 Handlebars 将生成以下输出:

// No value
Setting: {{ settings.example_text }}
// With value
Setting: {{ settings.example_text }}

输出结果：

// No value
Setting:
// With value
Setting: Default text.

你可以使用 if helper 来检查值是否为空字符串。例如：

{{#if settings.example_text}}
  {{settings.example_text}}
{{/if}}

基于资源的设置​

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

例如，如果你有以下 page_picker 类型设置：

{
  "type": "page_picker",
  "id": "page",
  "label": "Page"
}

那么你可以像以下这样检查是否为空:

{{#if settings.page}}
  {{ settings.page.title }}
  {{ settings.page.content }}
{{else}}
  No page selected, or the selected page is invalid.
{{/if}}

基于资源的旧版设置​

过去，基于资源的设置返回关联资源的句柄，你需要通过该句柄在 Handlebars 中访问实际对象。

例如，如果你有以下 page_picker 类型设置：

{
  "type": "page_picker",
  "id": "page",
  "label": "Page"
}

那么你可以像以下这样检查是否为空:

{{#if settings.page}}
  {{assign 'page' (get settings.page ../pages) }}
  {{ page.title }}
  {{ page.content }}
{{else}}
  No page, or invalid page, selected.
{{/if}

动态源​

JSON templates 中包含的 section 和 block 的设置选项允许商家根据设置类型连接一个或多个动态数据源。

了解更多关于动态数据源的信息。

平台控制的设置​

在 SHOPLINE 的主题编辑器中，SHOPLINE 在主题和 section 级别上公开了一个自定义 CSS 设置。你不能在设置架构中添加或隐藏这个设置。

商家使用这个设置添加的任何自定义 CSS 都存储在 custom_css 属性中，可以是在 JSON templates 的 section 属性中，也可以是在 settings_data.json 的 platform_customizations 对象中。

这个设置旨在使用户能够自定义他们商店的外观，而无需编辑主题代码。作为主题开发者，你不应该添加这个设置，或在设置后编辑这个设置的值。相反，你应该使用专门的 CSS 资源和 stylesheet Handlebars helper，并在这些领域使用主题设置引入 CSS 的自定义选项。