Sangria 版型使用指南

1.SHOPLINE_________png.png

banner_copy.jpg

誠意推出時尚新版型 - Sangria。專為售賣服裝飾品的店家而設計,迎合市場流行的時尚風,為你打造符合品牌風格的商店。版型最大特色為響應式圖片,圖片隨螢幕寬度縮放,瞬間提升商品的吸引度!

*注意:若您目前的商店方案為正式方案,且僅有「社群購物」方案,將無法變更商店版型。

 

 

一、客製化網店主題顏色和字型

位置:管理後台 > 商店設計 > Sangria 設定 >  店面版型

1. 自訂主題顏色

Group_1.jpg

 

為迎合品牌形象可為網店設定主題顏色,使用不同的搭配能為你的網店打造具有獨特性的風格。使用色碼可以控制整個網站的按鍵、重點資訊等,請使用 HEX 六位數色碼。(避免使用淺淡的顏色,以提高可讀性)

色碼參考:https://htmlcolorcodes.com/

_____2019-01-09___11.58.27.png

Group_4.jpg

 

2. 自訂主題字型

同時也提供客製化網店字型,此版型提供兩款字型,一旦套用,整個網站都會換成選用的字體。

  • 黑體:較適合現代、簡約的風格
  • 宋體:為襯線字,較適合經典、文青風格的網站。

Group_5.jpg

 

 

二、響應式版型

Sangria 為響應式版型,圖片會隨螢幕寬度縮放,商品圖片的預設比例為 3:4 更適合販賣服裝的店!可在後台 > 商店設計進階設計設定 裏設定「自動把商品圖片裁剪成設計預設相框的大小」可讓圖片更整齊。

建議商品圖片尺寸:825px (寬) x 1100px(高)

 

請記得使用圖片壓縮工具,讓大圖不會佔用顧客太多網路流量導致網站讀取速度過慢,推薦使用:https://www.iloveimg.com/zh-tw/compress-imageGroup_2.jpg

 

 

三、商品分類橫幅

可在每個商品分類裡加上相關的橫幅為該分類添上專屬的封面!為了瀏覽體驗,建議不要使用高度太大的圖片。

位置:管理後台 > 商品和分類商品分類 > 編輯 > 分類橫圖

建議尺寸:1800px (寬) x 400px(高)

Group_3.jpg

 

 

四、兩列商品明細頁

1. 兩列商品圖片

嶄新商品明細頁的商品圖片以兩列的方式呈現,特別適合商品圖片多的店,讓顧客有更好的的瀏覽體驗。

 

2. 快速連結

為了可以顯示更多商品圖片,怕顧客容易忽略商品資訊?可以試一下點擊「加入購物車」按鈕下方的文字連結,可以直接帶顧客到相關的區塊!

 

3. 置頂按鈕

要是頁面被滑到下面看不到購買按鈕怎麼辦?不用怕,Sangria 會在上方一直顯示「加入購物車」的按鈕,顧客可以隨時購買。

ezgif.com-video-to-gif.gif

 

 

五、部落格樣式

Sangria 突破舊有部落格排版,推出嶄新的設計。分為兩個區塊:

  • 一個為大圖片:最頂的永遠顯示最新發布的文章,大圖片能吸引讀者。
  • 一個為四個小圖片:一行顯示四則文章,只會顯示標題,凸顯文章的主旨。

部落格列表頁的圖片會顯示文章內的第一張圖片,比例都是統一 1:1, 但不用去特意裁減圖片,因為點進內文能看到全圖。若文章沒有圖片,會顯示小圖標。

ezgif.com-video-to-gif_copy.gif

 

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

 

 

 

 

 

還有其他問題?提交請求

評論