Shopify编程二次开发初体验

您好,欢迎。

这次简单介绍一下有关于Shopify编程二次开发组件的相关问题。希望您看了有所收获。

Shopify主题的组成

Shopify 主题是使用 Shopify 的主题模板语言Liquid以及 HTML、CSS、JavaScript 和 JSON 构建的。自定义组件的内容和外观主要是在Liquid文件中进行编辑。如何选择想要编辑主题并且进入代码编辑界面方面的内容,将在下一章进行介绍。如果您感兴趣,欢迎您点击关注,我会不定期分享更多关于Shopify的相知识。

Shopify的标记和功能

 

一般Shopify的界面结构如上图所示。界面主要分成四部分

1. 布局文件

2. 布局文件中的模板

3. 模板中的部分

4. 每个部分包含的块

布局文件(layout)是头文件包含了模板( template ),模板包含了部分(section),部分包含了块(block)。四个部分是层层包含的关系,在shopify中组成了界面现在的样子,同时在编程开发中也同样是按照这四个模块进行分类的,在下一篇文章中,会简单介绍编辑界面的这四个模块。

 资产文件(assets)

---

资产文件可不是字面意思的“资产”,和钱没有半毛钱的关系。一般资产文件是用来存放Shopify中的相关的资源文件,比如js文件,css文件等用来是得所有界面都能引用生效的相关文件。比如css文件设置了标题的颜色(红色)和字体大小(20像素),在其他界面使用了这个css中的样式的时候,就能让这个界面的标题变成标题这个样式。

需要掌握的相关技术

---

在进行Shopify的编程开发之前,建议您先掌握一下的基础知识:

1. HTML

2. CSS

3. JS

4. liquid语法

关于HTML,CSS,JS相关的学习链接,关注我公*众*号(智文it),回复前端基础即可获取学习资料链接。