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)在发布...窗口中,单击发布。

发布新模版后,您之前的模版会显示在模版页面的更多模版部分。

模板使用自定义类型_「Shopify模板」Shopify模板编辑Shopify模板代码更改教程相关推荐

  1. 模板使用自定义类型_自定义虚幻图表_拓展蓝图功能

    最近研究了下虚幻的图表编辑器写法,制作了个基础模板给大家用来制作自己的编辑器~ 资源类型节点编辑器(提供了基础的节点编辑功能.并保存时转化为UObject的子类的运行时数据结构): Eragon-Br ...

  2. entity什么类型_「知否」知识地图和知识图谱是什么?

    不问不知,不学不成.知识管理"知否"? 精短解答,轻松和你踏上知识管理进阶之路.今日知否:知识地图和知识图谱是什么? 问题: 经常听到知识地图和知识图谱?是一回事情吗?分别是什么? ...

  3. 下标要求数组或指针类型_「IEC 61131-3」衍生数据类型

    衍生数据类型是用户在基本数据类型的基础上,建立的由用户自定义的数据类型,与基本数据类型所使用的相同方法对变量进行声明. 数组 数组是多个相同类型数据的有序集合.组成数组的各个变量称为数组的元素,用于区 ...

  4. c++模板 --- 类模板、自定义类型当做模板参数

    生成一个类模板 类中用到了未知类型叫做类模板 用 template 修饰的类,这个类就是一个模板类 多用在数据结构中,忽略类型的问题 只要被 template 修饰,就是一个模板类,有没有用未知类型都 ...

  5. 2019b官方手册中文版_数据科学|「最全」实至名归,NumPy 官方早有中文教程,结合深度学习,还有防脱发指南...

    文章须知 文章作者:机器之心 责任编辑:书生 审核编辑:阿春 微信编辑:玖蓁 本文转载自公众号 机器之心 (ID:almosthuman2014) 原文链接:「最全」实至名归,NumPy 官方早有中文 ...

  6. js模板字符串自定义类名_详解JavaScript ES6中的模板字符串

    这篇文章主要介绍了详解JavaScript ES6中的模板字符串,JS的ES6版本带来诸多简洁化方面的重大改进,需要的朋友可以参考下 在 ES6 中引入了一种新的字符串字面量 - 模板字符串,除了使用 ...

  7. js模板字符串自定义类名_【Vue.js 入门到实战教程】07Vue 组件注册 | 基本使用和组件嵌套...

    来源 | https://xueyuanjun.com/post/21929除了前面介绍的基本语法之外,Vue.js 还支持通过组件构建复杂的功能模块,组件可以称得上是 Vue.js 的灵魂,是 Vu ...

  8. go 自定义error怎么判断是否相等_「GCTT 出品」Go 系列教程——30. 错误处理

    Go语言中文网,致力于每日分享编码.开源等知识,欢迎关注我,会有意想不到的收获! Go 系列教程是非常棒的一套初学者教程,入门就它了. 这是 Golang 系列教程中的第 30 篇.在本章教程中,我们 ...

  9. 自定义变量 配置文件_「系统架构」Nginx调优之变量的使用(3)

    在上一篇文章「系统架构」Nginx调优之变量的使用(2)中我们介绍了自定义变量和内置变量,下面我们继续接着介绍Nginx中变量的可见性和动态内置变量. 变量的可见性 nginx中的变量虽然不全是全局变 ...

最新文章

  1. vue 循环 递归组件_全局组件实现递归树,避免循环引用
  2. 计算机软件集成项目工程师上海,2021年上海系统集成项目管理工程师报名时间和报名入口...
  3. ML之DT:基于DT决策树算法(交叉验证FS+for遍历最佳FS)对Titanic(泰坦尼克号)数据集进行二分类预测
  4. 伪类的使用之如何在一段文字前面添加一个点
  5. 学习《css世界》笔记之使用overflow做文字溢出点点点效果
  6. hibernate学习内容
  7. oracle 操作 卡,oracle 12c 数据库上编写SQL语句时卡顿的问题解决
  8. netbeans-xdebug 断点调试php
  9. 2016中国app年度排行榜:十大行业、25个领域、Top 500 和2017趋势预测
  10. [深度学习概念]·深度学习的人脸识别技术发展综述
  11. i.MX Yocto Project User‘s Guide
  12. utc时间 单位换算_DataTime.Now.Ticks精确的时间单位[转]
  13. access行列转换。
  14. 精益和敏捷的较量:你知道敏捷开发有 Scrum 和 Kanban 两种管理模式吗?
  15. NodeJs+mongoose实现搜索功能
  16. 马建威android视频,5.25春季班高级班第三期第五节课课堂总结
  17. FTPC 在制品跟踪(WIP Tracking)对象
  18. 计算机网络与网络管理 基础知识
  19. 如何使用大智慧条件选股
  20. idata 单片机 新唐_请教新唐单片机N76E003内存空间不足的问题

热门文章

  1. Sql Server 日志清理 (数据库压缩方法)
  2. 一个小而美的博客——前端——index
  3. android 日期弹出框,Android 日期选择框 简洁常用
  4. distinct和group by不能一起用_内裤用热水洗更好吗?能不能和袜子一起洗?了解后炎症或能少困扰...
  5. wps定位对话框快捷键_Word、Excel、PPT快捷键汇总
  6. mysql 硬负载_为啥单机MySQL又遭遇瓶颈?MySQL主从复制替你解决单机问题
  7. java中的me关键字_java中的volatile关键字
  8. 在mysql中会话变量前面的字符是什么_在MySQL中仅使用会话变量仅对字符的首次出现执行搜索/替换...
  9. python xgboost参数_如何对XGBoost模型进行参数调优
  10. 动态规划--编辑距离问题