# 侧边栏设置

> 侧边栏设置用 header 和 paragraph 元素在主题编辑器里组织并说明 Shoplazza 主题的输入型设置，本页讲这两种类型及其属性。

Sidebar 设置不保存值且不可配置。它们是信息展示元素，可为您的输入设置提供补充说明和组织结构。

Sidebar 设置由[标准属性](./sidebar-settings#标准属性)组成，类型如下：

* [header](./sidebar-settings#header)
* [paragraph](./sidebar-settings#paragraph)

:::tip
如果您想添加输入设置（例如复选框），请参考[输入设置](./input-settings)。
:::

## 标准属性

以下是所有 sidebar 设置通用的标准属性：

| 属性       | 描述                                                                                                                                     | 是否必填 |
| :--------- | :--------------------------------------------------------------------------------------------------------------------------------------- | :------- |
| `type `    | 输入设置类型可以是 [header](./sidebar-settings#header) 或 [paragraph](./sidebar-settings#paragraph)。 | 是       |
| `content ` | 设置内容将在主题编辑器中显示。                                                                                                           | 是       |

## header

`header` 类型的设置输出一个标题元素，帮助您更好地组织输入设置。除了 sidebar 设置的[标准属性](./sidebar-settings#标准属性)外，`header` 类型设置还具有以下属性：

| 属性   | 描述                                   | 是否必填 |
| :----- | :------------------------------------- | :------- |
| `info` | 关于该设置的可选说明文字。             | 否       |

例如，以下设置将生成如下输出：

```json
{
  "type": "header",
  "content": {
    "en-US": "Email Signup",
    "zh-CN": "邮箱注册"
  },
  "info": {
    "en-US": "Subscribers added automatically to your "accepted marketing" customer list.",
    "zh-CN": "订阅者会自动添加到您的"接受营销"客户列表中。"
  }
}
```

**输出：**

## paragraph

`paragraph` 类型的设置输出一个文本元素，帮助您更好地描述输入设置。除了 sidebar 设置的[标准属性](./sidebar-settings#标准属性)外，`paragraph` 类型设置还具有以下属性：

| 属性    | 描述                                       | 是否必填 |
| :------ | :----------------------------------------- | :------- |
| `style` | 段落内容的自定义样式选项。                 | 否       |

例如，以下设置将生成如下输出：

```json
{
  "type": "paragraph",
  "content": "All of your collections are listed by default. To customize your list, choose 'Selected' and add collections.",
  "style": {
    "color": "#898989"
  }
}
```

**输出：**

## 创建链接

您可以在 `info` 设置属性中[添加链接](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a)，方法是将链接文字用 `<a>` 标签包裹，并在其后紧跟括号中的 URL。

例如，以下设置将生成如下输出：

```json
{
  "type": "checkbox",
  "id": "show_filter",
  "label": {
    "zh-CN": "开启筛选",
    "en-US": "Enable filter"
  },
  "info": {
    "en-US": "To display the filter, add and <a href='/admin/smart_apps/store/menus' target='_blank'>customize filters</a>.",
    "zh-CN": "展示筛选器需要在后台添加<a href='/admin/smart_apps/store/menus' target='_blank'>筛选纬度</a>。"
  },
  "default": true
}
```

**输出：**