為了提供您的網站有更佳的美觀以及讓您的網站呈現更多相關資訊，店家可使用「商店頁尾」功能，依自已想要在網站頁尾放置更多的相關資訊。
一、後台操作方式：
步驟一
若您尚在使用「舊版頁尾」，最下方有功能提示訊息(如下紅框處)，點選「前往試用」按鈕，方可進入編輯頁面。
＊本功能一旦編輯送出，即無法回到舊的頁尾，請確定送出前仔細檢視。
若您已經在使用「新版頁尾」的話，點選「編輯」按鈕進入編輯頁面。
步驟二
進入頁尾編輯頁面，我們提供了一組通用的樣版，可放置您的相關資訊、條款，還有付款及物流 icon，可以調整或選擇刪除重新拉取您要設定的元件，相關各個元件的功能教學請點此了解。
＊金/物流圖示的部分，請依據您商店中已經有的金/物流方式來放置，請勿隨意放置您網站未提供的服務。
步驟三
編輯完畢，按下預覽，前往預覽您編輯後的樣式 ，確認無誤，點選「保存」您的網站頁尾即會依您所編輯預覽後的樣式呈現 。
注意：請確認你預覽的結果跟您所想改變的樣式為一致，再做「保存」!
二、加入社群軟體圖示
我們提供了下列社群軟體圖示 icon，可放置您的網站頁尾
步驟一
點選 「 A 」 的文字元件，將元件拖曳到畫面中
步驟二
點選「</>」View HTML 按鈕
貼上圖示的語法
我們有提供這些社群軟體圖示的語法，您可以挑選希望放在頁尾中的圖示，複製語法：
|
圖示 |
語法 |
|
|
<img style="height: 44px; width: auto; display: inline-block;" src="https://static.shoplineimg.co/assets/footer/social_facebook.png"/>
|
|
flickr |
<img style="height: 44px; width: auto; display: inline-block;" src="https://static.shoplineimg.co/assets/footer/social_flickr.png"/>
|
|
Google Plus |
<img style="height: 44px; width: auto; display: inline-block;" src="https://static.shoplineimg.co/assets/footer/social_google_plus.png"/>
|
|
|
<img style="height: 44px; width: auto; display: inline-block;" src="https://static.shoplineimg.co/assets/footer/social_instagram.png"/>
|
|
LINE |
<img style="height: 44px; width: auto; display: inline-block;" src="https://static.shoplineimg.co/assets/footer/social_line.png"/>
|
|
Sina Weibo |
<img style="height: 44px; width: auto; display: inline-block;" src="https://static.shoplineimg.co/assets/footer/social_sina_weiboo.png"/>
|
|
Tencent Weibo |
<img style="height: 44px; width: auto; display: inline-block;" src="https://static.shoplineimg.co/assets/footer/social_tencent_weiboo.png"/>
|
|
|
<img style="height: 44px; width: auto; display: inline-block;" src="https://static.shoplineimg.co/assets/footer/social_twitter.png"/>
|
|
|
<img style="height: 44px; width: auto; display: inline-block;" src="https://static.shoplineimg.co/assets/footer/social_wechat.png"/>
|
|
|
<img style="height: 44px; width: auto; display: inline-block;" src="https://static.shoplineimg.co/assets/footer/social_whatsapp.png"/>
|
＊提醒您：
一組 <img style=........ .png"/> 即表示一小段完整個圖示語法，您可以看到上面有好幾個語法片段，都表示不同的圖示。複製語法時，請您由 <img height=........ .png"/> 整段複製下來。
步驟三：確認無誤後保存
貼上語法後，再次點擊「</>」View HTML 按鈕來預覽圖示，確認無誤之後，按下「確定」> 「保存」
三、加入金/物流圖示
如同上方加入社群元件圖示的步驟，請先將 「 A 」 文字元件拖曳到畫面中，接著點選「</>」View HTML 按鈕，貼上預先複製好的圖示語法。
＊金/物流圖示的部分，請依據您商店中已經有的金/物流方式來放置，請勿隨意放置您網站未提供的服務。
金物流圖示的語法請參考：
|
圖示 |
語法 |
|
VISA |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_visa.png"/>
|
|
Master Card |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_master.png"/>
|
|
Paypal |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_paypal.png"/>
|
|
UnionPay |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_unionpay.png"/>
|
|
LINE Pay |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_linepay.png"/>
|
|
7-11 |
|
|
FamilyMart 全家 |
|
|
台新 |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_taishin.png"/>
|
|
American Express |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_amex.png"/>
|
|
綠界 |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_ecpay.png"/>
|
|
JCB |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_jcb.png"/>
|
|
Apple Pay |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_apple_pay_with_border.png"/>
|
|
Alipay HK |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_alipay_hk.png"/>
|
|
Alipay |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_alipay.png"/>
|
|
|
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/static/web/assets/footer/payme_red_on_white_bg.png"/>
|
|
|
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/static/web/assets/footer/payme_white_on_red_bg.png"/> |
|
Google Pay |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_google_pay.png"/> |
|
轉數快 |
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://static.shoplineimg.co/assets/footer/card_fps.png"/> |
PayMe
PayMe
四、自行更換社群軟體或其他圖示
若我們上方所提供的社群軟體圖示或其他圖示，樣式不符合您的需求，您也可以參考以下做法將圖片做更換。
步驟一
請先將圖片上載 SHOPLINE 提供的圖床空間「圖片庫」中
（了解圖片庫上傳與複製圖片 URL 的方式，請參考文章 圖片庫）
步驟二
從我們上方所提供的語法中，將圖片的連結更改成您的圖片連結，請更改紅字的部分：
社群軟體元件圖示：
<img style="height: 44px; width: auto; display: inline-block;" src="https://shoplineimg.com/assets/footer/social_facebook.png"/>
金物流圖示：
<img height="40" style="max-height: 40px; width: auto; display: inline-block; margin-right: 10px;" src="https://shoplineimg.com/assets/footer/card_visa.png"/>
步驟三：
如同加入社群軟體元件圖示、金物流圖示的步驟 ，點擊「</>」View HTML 按鈕，貼上圖示語法。
五、為文字＆圖示加入超連結
使用文字元件設定好內容之後，不論文字或是圖示可以直接匡選並在工具列點選「連結」按鈕來設定超連結，詳細操作步驟請點此了解
評論