type
status
date
slug
summary
tags
category
icon
password
简介
shopify theme 可以通过商店后台进行编辑，简单的拖拽点击就能改变主题。为了使其更具有定制性，灵活性，你可以在 theme, section, block 三个级别提供设置。
定义
可以在以下两个地方定义 setting：
- config > settings_schema.json
- sections 文件夹下的 section 文件中的 schema 标签里
setting 有众多的类型，下面以定义 checkbox 类型的 setting 为例：
如上，定义好 setting后，可以在商店后台，主题编辑器的右边展示对应的 checkbox 组件。
setting 有几个标准的属性，但根据类型的不同，会有一些额外的属性或不适用的属性：
属性 | 描述 | 是否必须 |
type | setting 类型 | 必须 |
id | setting id，用于访问时使用 | 必须 |
label | setting 说明，用于展示在主题编辑器中 | 必须 |
default | setting 的默认值 | 非必须 |
info | 可选的 setting 的信息文本（展示在setting 组件下方的一段话） | 非必须 |
所有类型
checkbox
渲染出一个 checkbox 组件。
访问时返回一个布尔值。
没有默认值则返回 false。
number
渲染出一个数值类型输入框组件。
额外的属性：
属性 | 描述 | 是否必须 |
placeholder | 输入框的placeholder | 非必须 |
访问时返回一个数值。
如果不输入任何值则返回 nil。
radio
渲染出单选按钮组件。
额外的属性：
属性 | 描述 | 是否必须 |
options | 单选按钮的选项 | 必须 |
访问时返回一个字符串。
不指定默认值，则返回第一个选项。
range
渲染出一个类型为range的输入框组件。
额外的属性：
属性 | 描述 | 是否必须 |
min | 输入的最小值 | 必须 |
max | 输入的最大值 | 必须 |
step | 输入的步进值 | 必须 |
unit | 单位，会显示在展示的数值的右边 | 非必须 |
访问时返回一个数值。
必须设置默认值，且为一个数值。额外的必须的属性页必须为数值。
select
渲染出一个下拉菜单组件。
额外的属性：
属性 | 描述 | 是否必须 |
options | 由包含 label/value 的option对象组成的数组 | 必须 |
group | 可添加到每一个option对象里，用于划分组 | 非必须 |
访问时返回一个字符串。
不指定默认值，则返回第一个选项。
text
渲染出一个单行文本输入框组件。
额外的属性：
属性 | 描述 | 是否必须 |
placeholder | 输入框的placeholder | 非必须 |
访问时返回一个字符串。
不输入则返回 EmptyDrop。
textarea
渲染一个多行文本域组件。
额外的属性：
属性 | 描述 | 是否必须 |
placeholder | 输入框的placeholder | 非必须 |
访问时返回一个字符串。
不输入则返回 EmptyDrop。
上面的 setting 都是基础的类型，下面的则为专门的类型。
article
渲染出一个文章选择器组件。
访问时返回一个 article 对象。
不选择或选择的对象不存在，则返回 blank。
blog
渲染出一个博客选择器组件。
访问时返回一个 blog 对象。
不选择或选择的对象不存在，则返回 blank。
collection
渲染出一个产品系列选择器组件。
访问时返回一个 collection 对象。
不选择或选择的对象不存在，则返回 blank。
color
渲染出一个颜色选择器组件。
访问时返回一个 color 对象。
如果没选择颜色，则返回 blank。
color_background
渲染出一个可设置背景色或背景渐变的组件。
访问时返回一个字符串。
如果没设置颜色，则返回 nil。
font_picker
渲染出一个字体选择器组件。
访问时返回一个 font 对象。
默认值是必须的，如果不设置默认值会报错。
html
渲染一个多行文本域组件。
额外的属性：
属性 | 描述 | 是否必须 |
placeholder | 输入框的placeholder | 非必须 |
访问时返回一个字符串，字符串中的 <html> <head> <body>标签会被删除。
不输入则返回 EmptyDrop。
image_picker
渲染出一个图片选择器组件。
访问时返回一个 image 对象。
不选择或选择的对象不存在，则返回 nil。
link_list
渲染出一个菜单选择器组件。
访问时返回一个 linklist 对象。
不选择或选择的对象不存在，则返回 blank。
liquid
渲染一个多行文本域组件。
访问时返回一个字符串，此字符串会被解析成 liquid 模板语言。
不输入则返回 EmptyDrop。
page
渲染出一个页面选择器组件。
访问时返回一个 page 对象。
不选择或选择的对象不存在，则返回 blank。
product
渲染出一个产品选择器组件。
访问时返回一个 product 对象。
不选择或选择的对象不存在，则返回 blank。
richtext
渲染出一个富文本编辑器组件。
访问时返回一个字符串。
不输入则返回 EmptyDrop。
url
渲染出一个url选择器组件。
只能选择以下商店资源：
- Articles
- Blogs
- Collections
- Pages
- Products
- Policies
访问时返回一个字符串。
不输入则返回 nil。
video_url
渲染一个输入框组件。
额外的属性：
属性 | 描述 | 是否必须 |
accept | 接受一个已接受的视频提供者数组。 有效值为youtube、vimeo或两者都有。 | 必须 |
placeholder | 输入框的placeholder | 非必须 |
访问时返回一个字符串。
不输入则返回 nil。
header
渲染出一个标题，不能在主题编辑器中修改，仅用于作为其他可输入类型组件的标题。
paragraph
渲染出一个段落，不能再主题编辑器中修改，仅用于作为其他可输入类型组建的描述。
创建一个链接
可以在 info 属性中使用 markdown 语法添加一个超链接。
访问 setting 值
你可以通过以下三个不同对象来访问 setting 值：
- 全局 settings 对象
- section 对象
- block 对象
例如：
检查 setting 的值是否为空：
- 作者:HRope
- 链接:https://hrope.cn/article/theme-guide
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。