網站架構、分頁、色彩及選單目錄等都已設定完成了，接下來只要點點滑鼠拖移頁面的元件，就能快速排列出獨一無二兼具美觀的網頁，讓設計網站變成一種樂趣。讓我們依照下面的設定來一一介紹meepShop強大的元件設定吧！

1. 插入圖片

Step1 : 點選商店設計-頁面設計

Step2 : 選擇需要設計的頁面後，點擊右下方編輯

Step3 : 選擇元件

Step4 : 將您要設定之選項(圖片、輪播、圖片文字)拖拉至右方頁面

Step5 : 點選剛剛拉的區塊元件並上傳圖片

Step6 : 設定圖片替代文字，為您頁面上的圖片設定替代文字Alt ，幫助google判斷圖片關鍵字，提升搜尋結果排名

Step7 : 設定點選該圖片是否要連結

開啟連結，則會有「輸入網址」、「分頁設定」、「頁面群組」三種連結方式可設定。 

• 圖片連結「輸入網址」的用法

①您可直接輸入要連結之網址 EX: 要連至Facebook則輸入 https://www.facebook.com/

②若想要讓顧客可直接撥打電話給您，請在超連結裡填上電話號碼，

須符合國際撥號格式：+國碼-區碼-電話號碼。撥號連結裡的數字，國碼用加號，分隔標記用減號，不能有空白字元。

設定完成後前台消費者點選圖片即可撥號。

市話格式（以台北為例）：+國碼(886)-區碼(2)-電話號碼(3278918)

手機格式：+國碼(886)-手機號碼(912888888)。

• 圖片連結「分頁設定」的用法

 選擇您該圖片要連至您設定好的其他頁面，可選擇分頁設定，找到您欲連結的分頁即可

• 圖片連結「頁面群組」的用法

若您該圖片想要連至同一頁的其他群組，您可先再該頁面設定拉多個群組，並將該圖片連結選擇使用「頁面群組」，點選該圖片即會跳至您選定的群組位置

EX: 如下圖，按上方的圖片即可跳至下方商品列表選單，則可使用頁面群組的功能喔!

Step8 : 設定點選圖片連結其他分頁開啟，是否需皆另開新視窗

Step9 : 是否要設定追蹤連結，此功能使用FB像素和GA事件追蹤連結點擊，須至廣告分析頁面完成追蹤工具設定，詳細設定請參考-建立自訂廣告事件（天眼）。

Step10 : 設定圖片大小寬度及勾選設定輪播圖片呈現方式  

2. 插入圖片文字

Step1 : 點選商店設計-頁面設計

Step2 : 選擇需要設計的頁面後，點擊右下方編輯

Step3 : 選擇元件

Step4 : 將「圖片文字」元件拖拉至右方頁面

Step5 : 按下編輯按鈕上傳圖片

Step6 : 設定圖片替代文字，為您頁面上的圖片設定替代文字Alt ，幫助google判斷圖片關鍵字，提升搜尋結果排名

Step7 : 設定點選該圖片是否要連結，若需要連結請開啟開關，貼入網址。

Step8 : 設定圖片寬度大小

Step9. 10 : 設定圖片文字的標題及敘述內容、文字大小、位置等資訊

3. 插入圖片並設定圖片連結 影片說明