Shopify模板编辑&Shopify模板代码更改教程
Shopify模版是决定在线商店外观的模板。不同模版的样式和布局有所不同,可为客户提供不同的体验。例如,如果您销售的是水疗产品,那么您可能希望您的在线商店给人一种放松和奢华的感觉。或者,如果您销售的是电子产品,那么您可能希望您的Shopify在线商店外观时尚且充满活力。
您可以使用模版编辑器从Shopify后台自定义模版设置。如果Shopify模版中的设置没有涵盖您想进行的更改,则可以编辑您的模版代码。
当您更改Shopify模版或切换到新模版时,并不会影响您帐户的其他部分。您可以使用不同的模版样式和设置,而无需担心后台中的其他内容。
本篇文章将为您详细介绍关于Shopify模板的三个方面:
1.如何编辑自定义Shopify模板设置
2.如何编辑Shopify模板代码
3.如何发布新的Shopify模板
一、编辑自定义Shopify模版设置
您可以编辑Shopify模版设置以自定义在线商店的内容、布局、版式和颜色。每个Shopify模版都提供了一些设置,可供您用于更改Shopify商店的外观,而无需编辑任何代码。
1.自定义模版前的准备工作
在自定义模版之前,最好执行以下任务:
(1)复制您的Shopify模版以创建一个备份副本。这使您在需要时能够轻松地放弃更改并重新开始进行自定义。
(2)确保您了解可用的支持级别。
(3)了解上传图片的要求和最佳做法。
2.编辑您的Shopify模版设置
具体操作步骤:
(1)在Shopify后台中,转到在线商店 > 模版。
(2)找到您要编辑的模版,然后点击自定义。
不同类型的页面具有不同的模版分区。首次打开Shopify模版编辑器时,将显示Shopify主页的设置。要访问其他页面的设置,请从顶栏下拉菜单中选择页面类型:
模版编辑器工具栏分为分区和模版设置。
您可以使用分区修改Shopify商店上不同页面的内容和布局。您可以使用模版设置对商店的字体和颜色进行自定义,并且对社交媒体链接和结账设置进行更改。
提示:如果使用来自Shopify的免费模版,那么您可以通过参阅来自Shopify的免费模版以及单击模版的名称来查看此模版的分区和设置的详细信息。
3.获取有关自定义项的帮助
如需更改Shopify模版方面的帮助,则可以联系您的模版开发人员寻求支持。
二、编辑Shopify模版代码
您可以通过编辑Shopify模版代码来对在线商店进行详细更改。构成模版的大多数文件都包含Liquid,这是Shopify的模版语言。模版文件还包含HTML、CSS和JavaScript。只有在您了解HTML和CSS,并具备Liquid的相关基础知识时,才可编辑Shopify模版的代码。
1.编辑Shopify模版代码具体操作如下:
(1)在 Shopify后台中,转到在线商店 > 模版。
(2)单击操作 > 编辑代码。
(3)代码编辑器的左侧显示了模版文件的目录,右侧显示了用于查看和编辑文件的空间:
(4)可以通过单击展开图标来展开代码编辑器以填充屏幕
(5)可以通过单击折叠图标来将页面恢复正常
(6)单击左侧目录中的文件时,它将在代码编辑器中打开。您可以一次打开和编辑多个文件。您修改的所有文件都会在文件名旁边显示一个紫色圆点:
这可以帮助您跟踪已做出更改的地方。
如果在单击保存后想要恢复对文件的任何更改,请打开此文件,然后单击旧版本。下拉菜单将显示您每次保存的日期和时间。选择要恢复到的版本,然后单击保存。
当代码编辑器扩大至全屏时,您可以通过单击页面底部的按钮在亮和暗之间切换编辑器颜色方案:
2.Shopify模版代码自定义教程
您可以按照模版代码自定义教程来指导您对在线Shopify商店进行更改。此教程是根据他们修改的页面或功能类型进行整理的。
三、发布新的Shopify模版
您最多可以为在线商店添加 20 个模版,但一次只能发布一个模版。已发布的Shopify模版是客户在访问您的在线商店时看到的模版。已发布的模版将显示在模版页面的当前模版部分中,未发布的模版将显示在更多模版部分中。
发布新模版时,先前发布的模版将移至更多模版部分。不会丢失您进行的任何模版更改。
总共有2种方式可以发布新的Shopify模板:模版编辑器和Shopify后台
1.从后台发布Shopify模版
步骤:
(1)在 Shopify 后台中,转到在线商店 > 模版。
(2)在更多模版部分中,查找要发布的模版,然后单击操作 > 发布。
(3)在发布...窗口中,单击发布。
发布新模版后,您之前的Shopify模版会显示在模版页面的更多模版部分。
2.从模版编辑器中发布模版
具体操作如下:
(1)在 Shopify 后台中,转到在线商店 > 模版。
(2)在更多模版部分中,查找要发布的模版,然后单击自定义。
(3)在模版编辑器的顶栏上,单击发布。
(4)在发布...窗口中,单击发布。
发布新模版后,您之前的模版会显示在模版页面的更多模版部分。