模板开发 Step by Step
本指南提供在 Baklib 平台内开发自定义模板的分步说明:复制组织模板、修改静态与动态页面,并在前端验证效果。
前置条件
动手前请确认已完成:
- 选择与安装模板 — 已从市场或 Git 安装模板并创建应用。
- 进入编辑器与版本管理 — 已将公共模板复制到组织、选定开发版本(如
dev1.0),并进入该版本的代码编辑器。
若公共模板不可编辑,在模板开发界面按提示「复制模板版本(main)至当前组织」,设置版本号后在【应用设置】→【界面展示】中选择该组织模板版本,再点击「进入模板开发」。
也可观看交互式引导:Guidejar 模板开发教程
动手教程
1. 在 statics 目录添加静态页面
在编辑器左侧
/statics 目录下新建静态页面文件。2. 添加 hello.liquid
新建
hello.liquid 静态文件。3. 编辑文件内容
在文件中输入
Hello World,点击右上角「保存」。4. 预览静态页
在网站前端访问
/s/hello 即可查看静态页面。5. 编辑动态模板页面
在
/templates 目录下修改动态模板,例如首页 index.liquid。6. 修改首页代码
可任意修改
index.liquid。例如将 Hero 区块注释掉后点击「保存」。7. 前台预览
注释前首页效果:
8. 刷新验证
刷新页面后 Hero 区域消失,说明模板修改已在前端生效。
FAQs
如果我在尝试编辑模板时遇到错误怎么办?
请尝试刷新页面。若问题仍在,检查网络连接或重新登录,并回顾最近改动以排查代码冲突。
我如何知道我对模板所做的更改是否反映在网站上?
保存后访问站点前端并刷新页面。若看不到变更,确认已保存且已清除浏览器缓存。
访问和编辑模板的先决条件是什么?
需在 Baklib 拥有账号,且对目标组织有权限。另需掌握基本 Web 开发概念:文件结构、Liquid 语法与 HTML。
为什么我需要将模板复制到我的组织?
复制后可在不影响公共模板及其他组织的前提下独立修改,变更仅作用于你的组织版本。
如何访问和使用模板中的静态文件?
静态文件存放在
/statics 目录。前端通过相对路径访问,例如 /s/hello 对应 /statics/hello.liquid。