Varm 版型使用指南

1.CHT_________png.png

varm.png

Varm 版型採用簡潔且富有摩登時尚感的設計,更加大氣、乾淨,幫助您打造網店的時尚新潮風格,適合販售家居園藝、烹飪廚具、手錶飾品、潮流鞋款、運動用品類等,追求商品圖細節展現與有呈現大量商品資訊需求的店家。

Artboard.png

在商品細節頁面,只要將滑鼠輕移至商品圖片上方即可放大查看圖片,讓所有細節一覽無遺,展現商品魅力,滿足顧客瀏覽需求。

 

 

 

一、依照品牌形象打造網店主題顏色

1. 自訂主題顏色

Theme_varm_______.png

將會套用在網店的按鈕、商品價格、頁面底部裝飾線。可使用品牌色或自訂顏色,打造網店獨特風格。(建議避免使用淺淡的顏色,以提高可讀性)

編輯位置:管理後台 > 網店設計 > 設計 > 店面版型 > Varm 版型設定
(編輯時請使用 HEX 六位數色碼,可參考https://htmlcolorcodes.com/

 

2. 頁尾顏色

將會套用在網站頁尾的「底色」,推薦頁尾底色不要使用過淺的顏色,並與頁尾文字互為對比色,確保文字清晰易讀。

Theme_varm_____.png

Artboard_Copy.png

 

 

二、商品細節頁特色介紹

1. 在商品細節頁一次只顯示一張商品圖,顧客可點擊左側上下箭頭瀏覽其他圖片。

___2020-08-18___4.13.33.png

2. 滑鼠懸浮圖片放大鏡效果:將滑鼠輕移至商品圖片上方,顧客即可放大查看圖片細節。若想更近一步瀏覽,點擊圖片右下角放大按鈕可以全螢幕檢視商品圖片。

___2020-08-18___4.15.20.png

3. 以分頁呈現商品描述、送貨及付款方式與顧客評價等資訊,讓顧客可以快速找到所需資訊,並專注於閱讀內容。

___2020-08-18___4.20.33.png

 

 

三、各頁面建議 Banner 尺寸

請記得使用圖片壓縮工具,讓大圖不會佔用顧客太多網路流量導致網站讀取速度過慢。

(推薦使用:https://tinypng.com/

 

1. 進階分頁

如果是頁首置頂 Banner,喜歡整個螢幕滿版圖片,可使用 1920 x 800 px。

1._varm_-_home_copy_8.png

 

如果不想佔滿整個螢幕,喜歡較窄的比例,推薦使用 1920x640px,會在桌機約佔滿 3/2 畫面範圍並露出一些下方資訊吸引用戶往下捲動。

1._varm_-_home_copy_7.png

 

2.商品列表頁

提供上傳對齊商品的 Banner,可以利用此區塊營造各個不同分類的情境和豐富度,建議 Banner 高度不超過 400 px,讓顧客在一進入商品列表頁時,能稍微看到第一排商品。
 
___2020-08-18___4.43.10.png

以上是 Varm 版型的特色介紹,立即試用看看吧!

 

 

 

 

 

還有其他問題?提交請求

評論