为了提供您的网站有更佳的美观以及让您的网站呈现更多相关资讯，店家可使用「商店页尾」功能，依自已想要在网站页尾放置更多的相关资讯
一、后台操作方式
步骤一
若您尚在使用「旧版页尾」，最下方有功能提示讯息(如下红框处)，点选「前往试用」按钮，方可进入编辑页面。
＊本功能一旦编辑送出，即无法回到旧的页尾，请确定送出前仔细检视。
若您已经在使用「新版页尾」的话，点选「编辑」按钮进入编辑页面。
步骤二
进入页尾编辑页面，我们提供了一组通用的样版，可放置您的相关资讯、条款，还有付款及物流 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"/>
评论