進階分頁

可用計劃:

✓ 基本計劃

✓ 高階計劃

✓ 豪華計劃

「進階分頁」的功能簡單易用,輕鬆排版,深受新手店主喜愛。店主可以選擇系統預設的樣板或空白頁面開始設計您的分頁。利用 Drag-and-drop (拖曳)功能組合橫額、圖片、影片、文字等元素,創造獨一無二的網店版面。

此文章將簡介:

1. 添加新元件操作示範
2. 新增文字段落
3. 新增文字及標題
4. 新增圖片項目
5. 新增影片項目
6. 新增單一商品展示
7. 新增分類商品展示
8. 新增Facebook專頁框
9. 新增地圖
10. 新增Instagram
11. 新增二維碼
12. 其他設定及功能
   12.1 為分頁命名
   12.2 設定SEO內容
   12.3 預覽頁面

 

首先進入「網店分頁」> 點選增加「進階分頁」按鈕 

 

選擇您喜愛的樣板

系統提供不同的樣板讓您參考使用。您可以選擇其中一個或點選空白的自己稍後進行排版

    

 


1. 添加新元件操作示範

在左方的目錄選單中的功能元件(下稱為元件),您可以拖拉希望加入的元件到您喜歡的位置

_____2017-02-21___3.39.58.png

 

拖拉元件到編輯工作區時,會以綠色區塊顯示元件能夠放下的位置

 

 


Screen_Shot_2016-03-10_at_11.21.17_pm.png

2. 新增文字段落

放下元件後會顯示我們預設的文字範例:

_____2017-02-21___3.50.12.png 

編輯文字時,請點選要編輯的文字元件,左側會顯示編輯文字工具

功能支援:段落工具、文字風格(粗體、斜體、底線)、文字對齊、清除格式、文字連結、字體顏色、字體大小

 


_____2017-02-21___3.40.32.png

3. 新增文字及標題

放下元件後會顯示我們預設的文字範例
文字塊分為兩個部份,上方為「標題」;下方是「描述」
標題和描述需分開編輯,與文字元件相同,請點選要編輯的文字元件,左側會顯示編輯文字工具

 

  


4. 新增圖片項目

你可以添加一幅圖片或以幻燈片形式展示多幅圖片,在彈出的選項框中上傳新的圖片並按拖動排序。
您還可以為每一張圖片設置不同的 URL 連結,當用戶點選圖片的時候就會自動打開連結。

 

 

設定全寬圖片模式

按圖片 > 左邊選單點選「設定」> 於圖片設定勾選「顯示全寬圖片模式」,不勾選則變回原來大小。

 

 


5. 新增影片項目

新增YouTube 影片

直接複製 Youtube 影片連結,放入元件中。

如需調較為自動播放,加入 ?autoplay=1&rel=0 到embed的連結尾部

 例:

 https://www.youtube.com/watch?v=V7BEzkRBp_g?autoplay=1&rel=0

 

 

新增VIMEO影片

直接複製 Vimeo 影片連結,放入元件中

 


 

6. 新增單一商品展示 

選擇您想展示的單一商品(可使用商品名稱或是標籤搜尋您想選擇的商品後)> 點選「保存」

 

 

選取完後會出現在左方編輯區的內容中,可以點選「修改商品」更換其他商品

 

「描述位置設定」是設定商品名稱及價格是在元件區塊的放置方式
預設是置左,可以更換置中或置右

 

   


7. 新增分類商品展示

選擇您想展示的商品分類(如「精選商品」)

 

您可於分類設定選擇是否顯示加入標題、描述、快速加入購物車功能;以及每頁顯示的商品數量,其預設為自動顯示分類裡排列最前的 24 件商品。

category_zh.png

 

若您勾選啟用「快速加入購物車」功能,顧客在頁面前台可透過點選「加入購物車」按鈕直接將商品加入購物車並繼續瀏覽該購物頁面,不需再跳至單個商品頁面進行選購。

instant_add_to_cart_-_zh_demo.gif

 

 


 

8. 新增 Facebook 專頁框

輸入您的 Facebook 專頁網址

  

 


map_icon.png

9. 新增地圖

左側選單出現 Google Map > 搜尋地址 > 按「確定」

insert_map.gif

了解其他新增地圖的方法

 


ig_icon.png

10. 新增Instagram

 

步驟一

在彈出選單按「授權應用程式」按鈕 

ig_1.png

 

步驟二

導向至 Instagram 登陸頁面 > 輸入個人密碼

ig_2_.png

 

步驟三

"Authorize" 按鈕繼續

ig_3.png 

 

步驟四

頁面會重新轉到後台,店家可以點擊方塊 > 按「取消連接」中斷與帳號連結

ig_4.png

 


qr_code_icon.png

11. 新增二維碼

在彈出選單輸入連結 > 按「確定」

qr_code_.gif

 


12. 其他設定及功能

12.1 為分頁命名

左側藍色「目錄」按鈕 > 「分頁設定」下的「分頁標題」> 輸入分頁名稱

 

12.2 設定SEO內容

左側藍色「目錄」按鈕 > 「SEO設定」> 輸入標題、簡介、關鍵字及描述性URL

了解更多關於SEO資訊

 

備註:如果不建立雙語言頁面,可以只填寫預設語言的分頁標題

 

12.3 預覽功能

您可以隨時預覽你的設計及排版,點選右下角綠色的「預覽頁面」按鈕進入預覽功能

preview_button.png

 

進入預覽功能後,您可以選擇查看網頁在不同的行動裝置上的顯示效果
由左至右分別為:手機、平板、電腦

 

您的網頁都可以自動適應

 

 

 

完成所有編輯後,記得按右下角的「保存」按鈕保存頁面!

 

 

還有其他問題?提交請求

評論

由 Zendesk 提供支援