• Topic主题TopicTopic
  • Sign in

店铺设计

选择好您在线商店的主题模板后,您可以对主题进行自定义设计,装修店铺以适应您独特的品牌需求。


 

目录

 


 

店铺设计前的准备工作

在自定义设计主题之前,最好执行以下任务,以便更顺利地完成设计:

准备好后,您可以开始设计店铺,路径:在 SHOPLINE admin 中,进入【在线商店】>【店铺设计】

 


 

添加公告栏

您可以添加公告栏以突出显示以下信息:

  • 任何发货延迟情况或不接受国际运输的区域。
  • 任何新的或更新的政策页面。
  • 目前提供的任何推广活动,例如促销、新的礼品卡、会员权益等。

店铺设计的公告栏

  1. 在 SHOPLINE admin 中,点击在线商店】>【店铺设计】>【设计】>【公告栏】
  2. 在组件下方点击【添加内容】可添加公告。
  3. 在【正文】编写公告栏文案,然后在【跳转链接】处选择对应的产品页或者详情页。
    Frame 35575080.png

备注

  • 部分主题模板的公告栏在【页头】中配置。
  • 不同主题模板可设置的内容略有差异,可根据实际情况进行设置。
  • 公告最多可以设置 12 条。


应用市场的公告栏

【应用】>【应用市场】中,安装【公告栏】插件进行配置,具体操作可参考公告栏

 


 

编辑页头

页头可以放置产品分类等内容,引导客户按照我们的规划进行浏览,最终实现转化的目的。

  1. 在 SHOPLINE admin 中,点击在线商店】>【店铺设计】>【设计】>【页头】。
    Frame 35575081.png
  2. 点击组件下的【添加内容】,您可以在页头编辑以下内容。
    • 商店 Logo:上传 Logo 图片,支持电脑端和手机端的 Logo 宽度自定义。
    • 菜单导航:页头的菜单导航默认为 Main Menu Header,如果您设置了其他导航,可以点击【更换】,链接之前设置好的菜单导航。关于菜单导航的设置步骤可以参考菜单导航管理
    • 超级菜单:当菜单有下级菜单时,可展示对应分类图片/商品图片/自定义跳转内容,为买家提供更好的展示效果或内容推荐。详细了解超级菜单配置指引
    • 页头固定在顶部:支持开启或关闭。
    • 展示其他页头工具:支持开启或关闭。点击【页头】组件,例如:搜索框入口、个人中心入口、购物车入口、语言选择器、国家选择器、货币选择器、货币符号等。

备注

  • 页头将默认应用于您的所有页面。
  • 不同主题模板可设置的内容略有差异,可根据实际情况进行设置。
 

 


 

编辑正文组件

  1. 在 SHOPLINE admin 中,点击在线商店】>【店铺设计】>【设计
    Frame 35575082.png
  2. 左侧栏,您可以添加和编辑以下通用组件:
    • 商品展示类:商品分类、精选商品、单个商品。
    • 图文展示类:图文模块、富文本、轮播图、图文列表、单图、图标声明。
    • 视频类:视频图文模块、视频轮播、视频。
    • 客户运营类:联系我们表单、邮箱订阅。
    • 信任组件:常见问题、地图、评论模块。
    • 博客类:博客。
    • 自定义类:自定义页面;自定义HTML。
      Frame 35575084.png

部分主题含有特色组件

【特色轮播图】:图片区域和文本区域区分展示,主题包括 Expect、Control、Soo、Flexible、Charm。
特色轮播图.png
【购物图片】:一张图片中展示多个商品,主题包括 Solid、Edges、Carfit、Cycle、Wink、Shine、Extent、Charm。
购物图片.png
【时间线】:按时间线展示内容,适用于介绍品牌历史,主题包括 Extent、Feeling、Shine、Wink、Blouse、Solid。
时间线.png
【活动推广】:展示系列活动和横幅标语,主题包括 Extent、Flexible、Blouse、Expect、Bloom、Deck、Edges、Soo、Metal、Cycle、Control、Carfit。
活动推广.png
【多级筛选】:多维度标签筛选,适用于汽配等复杂型号产品的网站,主题包括 Cycle、Edges、Carfit。
多级筛选.png
备注:如您在当前主题中未能找到满足您需求的组件效果,或者想个性化设置文本、按钮、背景、间距等,可以在应用市场安装使用【高阶组件库】。

 


 

编辑页脚

页脚可以放置政策页面、邮箱订阅、支付图标等内容,提供网站相关信息的说明,提升用户信任度。

  1. 在 SHOPLINE admin 中,点击在线商店】>【店铺设计】>【设计】>【页脚
    Frame 35575086.png
  2. 点击组件下的【添加内容】,您可以在页脚编辑以下内容:
    • 快速导航:输入导航标题,会显示在前台中。点击【更换】,链接之前设置好的菜单导航。关于菜单导航的设置步骤可以参考菜单导航设定
    • 自定义内容:支持输入富文本。一般可以放置联系方式、公司地址等。
    • 图片/LOGO:支持添加图片并设置跳转链接。
    • 邮箱订阅:支持自定义标题、按钮、输入框文案。
    • 展示其他页脚工具:点击【页脚】组件,支持开启或关闭工具展示。例如:社交媒体图标、语言选择器、国家选择器、货币选择器、货币符号、支付渠道图标、版权信息、版权申明等。

备注

  • 页脚将默认应用于您的所有页面。
  • 不同主题模板可设置的内容略有差异,可根据实际情况进行设置。

 


 

编辑商品详情页

  1. 在 SHOPLINE admin 中,点击在线商店】>【店铺设计】>【设计】,在顶部下拉选择【商品详情页】
    Frame 35575087.png
  2. 您可以在【商品详情】组件中编辑以下内容:
    • 视频:启用视频循环,自动播放视频。
    • 面包屑导航:是否显示面包屑,面包屑布局。
      备注:面包屑是在网页中使用的一种次导航,它类似于一个"路径",例如“Home/Collection/Product”,能够让用户清晰理解当前页面所处的位置,从而辅助用户快速移动到他们希望移动到的某个位置。
    • 商品图:商品图位置,商品图大小,电脑端放大镜,商品缩略图位置。
    • SKU:是否展示 SKU 编号,主图展示 SKU 图片,是否默认选中 SKU。
OS 2.0 版本的主题还支持区块拆分设置:标题,摘要,价格,销售信息,显示库存数量,SKU,多属性选择器,数量选择器,购买按钮,商品描述,分享,附加内容,文本,自定义HTML。
Frame 35575088.png

备注:

  • 只有 OS 2.0 及以上版本的主题模板支持设计【商品详情】组件。
  • 不同主题模板可设置的内容略有差异,可根据实际情况进行设置。

 


 

编辑商品列表页

  1. 在 SHOPLINE admin 中,点击在线商店】>【店铺设计】>【设计】,在顶部下拉选择【商品列表页】
    Frame 35575089.png
  2. 您可以在【商品列表】组件中编辑以下内容:
    • 分类:分类描述位置,子分类位置和列数,是否启用无限滚动。
    • 商品:商品数量,列数和行数,商品排序,商品摘要信息显示,价格展示方式,是否展示原价。
    • 商品图:商品图比例,商品图填充方式,鼠标悬停时显示下一张图,商品缩略图位置。

备注:

  • 只有 OS 2.0 及以上版本的主题支持设计【商品列表】组件。
  • 不同主题模板可设置的内容略有差异,可根据实际情况进行设置。

 


 

主题编辑器

当前查看的模板的所有内容会以树形图显示在侧边栏中。

编辑组件

使用展开图标  来展开组件结点以查看其中的块,还可以使用折叠图标  将其折叠来隐藏块。

点击任何组件或块来查看其设置,点击“添加组件”可以增加组件。

移动组件

使用 ⋮⋮ 图标来点击并拖动组件或块,然后将其拖放到其他可用位置。

如果您尝试将组件或块移动到不被允许的位置,则该分区或块将被放回原始位置。

隐藏组件

使用眼睛图标隐藏任何组件或块。

删除组件

点击进入组件或块,删除按钮显示在组件设置的底部。

Frame 35575090.png

 


 

主题设置

在基本搭建完网站的架构后,可以进行网站布局和色彩搭配的调整,进一步装修店铺,使网站更符合您的品牌调性需求。

  1. 在 SHOPLINE admin 中,点击在线商店】>【店铺设计】>【设计】>【主题设置】
    Frame 35575091.png
  2. 您可以在主题设置中编辑以下内容
    • 颜色:包括价格、按钮、标签、弹窗等位置的背景和文字颜色。
    • 字体:包括标题、正文、页头等位置的文字字体和大小。
    • 布局:包括页面、组件、列表等位置的宽度和间距大小。
    • 按钮/多属性选择器/输入框/内容容器/媒体文件/下拉菜单和弹窗/抽屉:包括边框和阴影等展示效果。
    • 商品:优惠标签和样式;商品列表:快速加购/查看,商品图比例,鼠标悬停时显示下一张图片,商品标题展示规则;商品详情:显示库存数量,多属性展示方式,数量选择器,图片放大,展示滑动箭头,默认选中 SKU,主图展示 SKU 图片,附加内容。
    • 分类:分类名展示样式,分类图比例。
    • 购物车:打开购物车的方式。
    • 结账:包括结账页 Banner、Logo、内容信息、订单摘要等位置的图片和样式,结账页字体,结账页按钮颜色。
    • 社交媒体:开启显示社交媒体图标,放置社交媒体链接,实现点击图标跳转至目标页面;支持在商品详情页等页面提供分享到社交媒体操作。
    • 网站图标icon:上传浏览器标签icon,尺寸 32*32 px。

您还可以为主题创建自定义模板,配置不同的页面样式和内容,详情参考创建模板

备注:不同主题模板可设置的内容略有差异,可根据实际情况进行设置。

 


 

发布主题

当您已经完成了店铺的设计,请点击【保存】

回到【店铺设计】>【我的主题】界面,【当前主题】是您的店铺前台所应用的主题。

当前主题.png

如果您需要应用其他设计好的主题,请下拉到【主题库】,选择想要发布的主题,点击【操作】>【发布】即可。

Frame 35575092.png

 


 

更多高阶设计建议

使用强大的网店设计应用,搭建高级精美的独立站,从网站顶部的超级导航到商品详情、博客、自定义等页面的元字段管理工具,让你的独立站迅速抓住顾客的注意力。

Mega Menu超级导航

导航是店铺的指路标,所以网页导航设计不但要有科学性,还需具有艺术性。快速创建超级菜单,商家可自定义设计出符合店铺风格的多级菜单导航。优化用户体验、提高店铺的品牌形象的同时,也为店铺带来更多的销售业绩。

个性化多层级菜单不仅让商品分类清晰易懂、店铺简洁美观,还提高了用户购物体验。饰品类卖家售卖的饰品有多种分类,如区分为男款、女款等多品类,且品类下还有细分如项链、手饰、腕表、耳饰等,需要在导航中分类展示。超级菜单生成器可以创建多个不同层级不同样式的菜单,商家可以将饰品大类(男式、女式等)设计为第一层级导航菜单,在每一层级下再进行细分品类菜单设计,并且可以以图片、商品、分类等多种菜单样式展示类别,让顾客能更快找到合适的商品。

高阶组件库

内容是店铺的门面担当,独具特色的网页版面往往能吸引顾客驻足。通过使用插件中样式丰富、配置能力强大的装修组件,商家可在当前店铺主题基础上配置出多种个性化效果来丰富网站内容,全方位地打造独特的网店展示效果。

添加高阶组件后,简单配置即可实现店铺多样化、个性化展示。添加 3 个画廊组件,可以通过配置画廊高度、背景不透明度、组件宽度、圆角半径,实现以上3种不同的画廊展示效果。插入含有时间轴的图文,你可以编撰品牌大事记,通过讲述自己的故事吸引目标消费者,让消费者产生认同感、信任感。

Metafields 元字段丨 细节才是王道

运营店铺最重要的就是关注细节。SHOPLINE 支持商家通过元字段设置额外拓展字段达到对店铺样式或功能定制化的目的。例如:

  • 在商品详情页中为您的多款商品添加不同的使用说明书
  • 为不同的商品,添加不同的精美图文介绍、不同的发货公告
  • 在不同的商品列表页中,添加不同的折扣优惠信息

零代码基础也能灵活的通过元字段实现高级定制化效果,帮你降低模板定制的门槛和成本,以及实现个性化功能需求。

 


 

如何联系我们

SHOPLINE 拥有专业的本地支持团队,为有需求和疑惑的商家提供帮助。您可以通过联系 SHOPLINE 店铺后台官方网页的实时客服来寻求 SHOPLINE 的帮助。
*如有 SHOPLINE 功能使用感受或需求建议,快点击【功能反馈】告诉我们吧!

 


 

还有其它问题?提交请求

评论