Bianco 版型使用指南

1.SHOPLINE_________.png

banner.jpg 

Bianco版型优雅登场,风格简约细致,适合贩售精品服饰、首饰、3C电子产品、化妆保养、质感选物类等有高清商品图需求或是文青风格的商家,搭配左侧固定目录,快速浏览商品分页与分类,以满版图片呈现,打造符合您品牌风格的商店!

 

 

一、依品牌风格定义主题颜色及主题字型

1.自订主题颜色:

可以自订主题颜色,将显示在网店的按钮、会员标签等地方,配合品牌形象,提升店铺的美感

编辑位置:管理后台>网店设计>设计>店面版型> Bianco版型设定

 

Group_1.jpg

 

可使用品牌色或自订颜色并套用为网站的主题色,请使用HEX六位数色码。 (避免使用浅淡的颜色,以提高可读性)色码参考:https://htmlcolorcodes.com/

_____2019-01-09___11.58.27.png 

Group_4.jpg

 

2.自订主题字型:

提供两种主题字型设计,思源黑体及思源宋体,套用後,整个网站都会换成选用的字体。

B2.png

黑体:较适合现代、潮流的风格,贩售年轻、高贵、简约商品的店;

宋体:为衬线字,端庄大方,适合经典、文青风格,贩售复古时装、传统商品的店。

 

 

二、分页目录及商品细节页功能介绍

Bianco的商店目录显示在页面侧边,因此商品图片得以更大的尺寸清楚呈现,商家可以利用更多精美的商品图片来介绍、行销商品。

 

1.电脑版

  • 此版型的特色 - 侧面目录。无论顾客到哪个页面,都能快速切换浏览其他页面
  • 分類頁會固定顯示目錄列表,適合也在目錄中加入商品分類,讓分類可以在左側固定展示。
  • 当滑鼠游标在分页按钮上时,会自动展开选单,也适合很多分页和商品分类,能一直往下滑动,有效显示分层关系。

bianco-menu.gif

 

关于网店主目录设定,请参考:网店目录管理
关于商品分类设定,请参考:排列分类及商品的顺序

 

2.手机版

Bianco的手机版设计也是此版型的重点之一! Bianco采用Bottom Navigation -目录置底,用户体验为参考手机程式的排版和操作,方便切换页面与手指的点击范围,周详考虑使用手机的顾客。
手机版与电脑版的目录不同,会同时在选单显示「目录」与「分类」列表,因此如果有在目录中加入商品分类,建议可以开启『手机目录选单显示:隐藏商品分类』,让电脑版与手机版显示一致。

bianco-mobile.gif 

 

3.商品细节页功能简介

商品主要图片以滑动式浏览,顾客在浏览商品图片时,不需点选图片放大查看,直接卷动页面。左侧目录和右侧的商品资讯区都是固定位置的,让顾客有流畅的购物体验。

bianco-pdp.gif

 

商品描述和送货付款方式会在主要图片的下方,可让顾客聚焦在商品图本身并有更大的空间显示商品描述内容和图片。 

bianco-pdp2.gif

  

 

 

三、利用Banner呈现行销广告,创造精美官网!

在网店的首页放置满版 Banner 以达到品牌的冲击感及推销的广告,吸引顾客的购买欲:handbag:

B7.png

 

如何把Banner设为满版:

编辑位置:管理后台>网店设计>网店分页>首页>编辑

使用图片元件,上传后可在设定里勾选「显示全宽图片模式」及「关闭上下间距」;也可上传多张以轮播图片方式呈现

 

商家也可以利用「上传手机版图片」的功能去迎合手机用户的顾客喔~ 手机版图片元件设定请参考:图片元件|进阶分页

请记得使用图片压缩工具,让大图不会占用顾客太多网路流量导致网站读取速度过慢,推荐使用:https://tinypng. com/

 

 

四、商品图片建议尺寸

Bianco版型提供的商品主要图片会按照使用者视窗的大小而改变,以达到商品图片观看的最佳效果

若想要图片有整齐的效果,可按照商品图片的默认尺寸比例 3:4 做设定,由于图片的大小会按比例缩放,所以建议的尺寸为:

建议商品图片尺寸:825px (宽) x 1100px(高)

 

编辑位置:商店设计>设计>进阶设计设定>勾选「自动把商品图片裁剪成设计预设相框的大小」

 

 

五、商品规格款式

与其他主题版型统一,Bianco也提供不同的规格选项的款式,有助提高网店美观度以及配合商品不同的规格的使用情境。

编辑位置:商品和分类>我的商品>编辑>商品规格
点击「编辑选项图片」以及勾选「显示选项图片于商品页面」
编辑位置:设定>商品设定>规格显示方式
选择商品规格于商店的显示方式

 相关商品规格显示设定请参考Faq:商品规格:商品規格:选项图片|商品

 

 

六、部落格版型设计

Bianco部落格版型为响应式设计,文章会自动使用文章内文的第一张图作为封面,并依照文章标题和封面长短比例调整高度和排版,文章排版顺序依旧维持图片为主的方式,由上而下,不需担心不会网页排版,因为Bianco已预先设计好如何呈现,让商家可以更轻松自由的产出文章来丰富网店!

B8.png

此版型的部落格页的图片也是按照视窗大小而改变,特别适合有大大美美图片的文章。 

 

以上是Bianco的特色介绍,立即试用看看吧! 

 

 

 

 

还有其它问题?提交请求

评论