Articles on: 官網設計

官網設計】在商品頁面新增 「聯繫我們」按鈕(Contact Form / Contact Form Plus)

此文章將說明如何在商品頁面上,新增「聯繫我們」 的按鈕 (Contact Form/Contact Form Plus)



Candy 或之前發佈之佈景主題(舊版主題)



步驟一:編輯原始碼

前往 EasyStore後台 → 銷售管道 → 品牌官網 → 佈景主題 → 編輯原始碼 → product.liquid → 於大約第 127 行 → 搜尋 AddToCartText



在指定的地方,貼上以下 Contact Form 代碼。


<a id="contactUsBtn" href="https://yourdomainname/apps/contact-form-plus" target="_blank" class="btn btn-contactus">
Contact us
</a>


💡 小提醒 :

你可以根據的喜愛,更改 "Contact Us" 按鈕名稱至其他字

若你不想要點擊按鈕後導向新的頁面,可將 target="_blank" 移除

切记需将 Contact Form 或者 Contact Form Plus 的连结,更换至你自己的连结



連結例子 :

Contact Form : https://yourdomainname/a/contact-form

Contact Form Plus : https://yourdomainname/apps/contact-form-plus

"yourdomainname" = 你的商店域名






步驟二 : 點擊儲存,完成!


Aroma 或其後發佈之佈景主題(新版主題)



步驟一:編輯原始碼


前往 EasyStore後台 → 銷售管道 → 品牌官網 → 佈景主題 → 編輯原始碼 → main-product.liquid 文件 → 搜尋 {% app_snippet 'product/button' %} → 於上方加入以下代碼

<a id="contactUsBtn" href="https://yourdomainname/apps/contact-form-plus" target="_blank" class="btn btn-contactus">
Contact us
</a>



切记需将 Contact Form 或者 Contact Form Plus 的连结,更换至你自己的连结

連結例子 :

Contact Form : https://yourdomainname/a/contact-form

Contact Form Plus : https://yourdomainname/apps/contact-form-plus

"yourdomainname" = 你的商店域名




步驟二 : 點擊儲存,完成!


前台顯示結果 :







Updated on: 12/01/2024

這篇說明對您有幫助嗎?

Share your feedback

取消

感謝!