Shopify Theme 代码目录结构简介

孤灯侠影

本帖最后由孤灯侠影于 2021-12-21 16:48 编辑

目录结构如下：

assets: 如字面意思, 这个目录下包含若干静态资源，如*.css(CSS 样式文件), *.js(JavaScript 脚本文件), *.ttf(字体文件)，*.png, *.jpg, *.css.liquid(liquid文件，本质也是CSS样式文件，里面会包含liquid代码，2.0主题已经不推荐)；

config: 此文件夹包含2个.json文件（json是一种键值对格式的文件，常用于表示数据，类似.txt文件）
settings_schema.json：此文件是后台的主题编辑器的"模板设置"设置区域的组织和内容，就是如图c-1中的红色框框。
settings_data.json：此文件和settings_schema.json是对应的，settings_data.json相当于是前者的应用，你在主题编辑器里面的编辑记录，都会记录到这个文件。

layout: 包含整个主题的引入，相当于最外层的容器，如图l-1中的“①”所示。

locales：承载的是多语言文件，PS: Shopify站点多语言文件也分三种，1. 网站页面的多语言（结构，如输入框的Email, ），2. 后台主题编辑器的多语言， 3. 网站内容的多语言（博客，产品名)。此处locales文件下对应的为前两种。

scss ：自己开发使用的文件。可忽略。

sections：此目录下为liquid文件。表示可重复使用的内容模块，例如图c-1中的绿色框框.参考图Y-1中的“③”。

snippets: 此目录下为liquid文件，表示更为细小的可重用的代码片段，例如一个图标引入。参考图Y-1中的“④”。

templates：此目录下为liquid文件，为页面上显示内容的模板，参考图Y-1中的“②”。

c-1:

y-1: