模版开发-代码在线编辑器

模版开发-代码在线编辑器

1.如果您是非技术人员，不懂前端开发，那么这里面不要操作，否则操作出来问题，影响网站运行

2.模版列表，每个模版都可以进行代码编辑，下面以当前模版进行操作

3.进入代码编辑器

4.进行操作之前，您需要先了解fecify的文件结构：模版文件结构

文件详解

一：文件类型

1.代码类文件：

• js文件
• css文件
• liquid文件

2.配置文件：

• 配置json文件

3.数据保存类文件

• json文件

下面对这3中文件类型进行详细说明

二：代码类文件

代码类文件：指的是模版开发，涉及到的文件

• assets文件夹：js文件和css文件
• layout文件夹：theme.liquid
• sections文件夹：liquid文件（所有liquid文件）
• snippets文件夹：liquid文件（所有liquid文件）

这些文件，里面都是模版代码，layout/theme.liquid是入口文件，sections下是装修卡片文件，snippets下是小部件文件，assets是js和css等静态文件

三：配置文件

配置文件，是json格式文件，是模版的一些配置，包括：

• config/settings_schema.json: 模版装修，全局配置，各个配置部分，通过读取这个文件的schema结构，进行渲染
• locales文件夹：翻译文件

四：数据保存文件

当进行模版装修，数据保存后，将保存到这些json文件里面，包括：

• config/settings_data.json: 模版装修，全局配置部分的装修数据，将保存到这个文件
• sections/header-group.json, sections/footer-group.json: 这2个文件在sections文件夹里面，保存的是头部和尾部的装修配置数据
• templates文件夹：各个页面，内容部分，进行装修的内容，将保存到这里的文件夹里面
• 数据保存文件，一般是通过模版装修，发布模版的方式，进行修改内容，一般不要在这里直接修改数据内容，除非您非常熟悉。

文件操作

1.点击左侧的文件树即可打开文件

• 进行编辑后，可以对文件的内容进行保存
• 保存后，可以看到文件树，文件尾部加了一个红点，代表这个文件被二次开发过了
• 可以查看文件历史编辑的log信息，点击后，代码可以切换到历史的内容

2.删除修改的内容

删除后，可以看到文件尾部的红点消失