Shopify专题
Shopify 模板目录结构入门
00 分钟
2022-11-22
2025-1-16
type
status
date
slug
summary
tags
category
icon
password
在每个商店主题下，有以下七个主要目录，以及一个 customers 文件夹，整体结构如下：

1. assets

assets 目录包含主题中使用的所有资源文件，包括图像、CSS 和 JavaScript 文件。要引用这些资源，可以使用 asset_url 过滤器，例如：

2. config

config 目录包含主题的配置文件，定义了主题设置及其存储值。此目录下有两个主要文件：
  • settings_data.json：存储在主题编辑器中修改的设置值。
  • settings_schema.json：控制主题编辑器的“主题设置”区域的组织和内容。

3. layout

layout 目录包含主题的布局文件，模板通过这些文件进行渲染。布局文件允许多个页面共享相同的结构，例如：

4. locales

locales 目录包含主题的语言文件，用于提供翻译内容。它允许商家在主题编辑器中提供多语言支持。

5. sections

sections 目录包含可重用的内容模块，商家可以对其进行自定义。每个 section 都可以包含多个可调整的 block。以下是 schema 标签的主要属性：
属性
说明
name
在主题编辑器中显示的 section 名称。
tag
默认是 div，定义 section 的标签名。
class
添加到 section 标签的类名。
settings
允许在主题编辑器中自定义 section 的选项。
blocks
定义 section 中的块。
max_blocks
每个 section 最多可创建 16 个块。
presets
section 的默认配置，便于商家添加到 JSON 模板中。
default
定义静态呈现的 section 的默认配置。
locales
提供 section 的翻译字符串集。
templates
限制 section 仅在特定模板中使用。

6. snippets

snippets 目录包含小型可重用代码片段。可以使用 Liquid 的 render 标记引用这些片段，例如：

7. templates

templates 目录下的每个 JSON 文件对应一个页面模板。JSON 模板定义了要呈现的 sections 及其设置。每个模板文件的结构如下：
属性名
数据类型
是否必须
描述
name
string
非必须
模板名称
layout
string
非必须
指定模板所属的布局文件，默认为 theme.liquid。
wrapper
string
非必须
动态生成的标签名，包含 sections。
sections
Object
必须
定义各个 section 对象。
order
Array
必须
定义 sections 的顺序。

示例

模板文件也可以是 liquid 文件，liquid 模板可配置性比较差，但 liquid 可以包含代码。
 
理解 Shopify 的模板目录结构是创建和定制主题的基础。通过合理组织这些目录和文件，商家可以实现灵活的在线商店设计。
上一篇
Liquid 入门基础
下一篇
Liquid Section 开发教程