動態結賬按鈕會根據店鋪后臺所支持的第三方快速結賬付款方式和顧客設備瀏覽器的記錄動態展示快速結帳按鈕，比如PayPal Express Checkout、Apple Pay等。當然如果瀏覽器沒有記錄或者店鋪后臺沒有支持的快速結帳付款方式，按鈕則會顯示為“buy it now”。

Dynamic checkout button

顧客可以使用動態結帳按鈕快速購買他們想要的商品，直接跳過購物車，縮短了購物流程，對店鋪的轉化率會有一定的提升。所以說，給商品模塊添加“立即購買”按鈕還是有必要的。

小貼士
1. 在進行代碼修改之前記得先去確認下模板編輯器中有沒有相關功能的設置項，如果有的話，就沒必要額外開發代碼來實現了；
2. 在做任何大的代碼修改之前，一定要記得備份模板，這樣即使把模板改亂了后面也可以輕松回滾代碼；
3. 需要懂一些基本的HTML、CSS、JS和liquid代碼知識。

一般模板會有兩個地方需要手動更新代碼來支持Dynamic checkout button，第一是商品詳情頁模板，第二是首頁Featured product section模塊。兩個地方的操作都是類似的，都是更新模板里的Product form部分。下面是操作演示。

步驟：

登陸到Shopify店鋪后臺, 找到Online Store > Themes；

選擇要編輯的模板，然后點擊Actions > Edit code；

在section文件夾中，找到以下兩個文件：

點擊 Product-template.liquid，有些模板可能直接是 product-form.liquid，打開文件；

點擊 featured-product.liquid，打開文件；

通過Command+F（Mac）/Ctrl+F（PC）搜索查找<form action="/cart/add". 找到之后，記錄該form標簽的屬性，比如class或者ID，這些屬性在我們更新form的時候還要添加上去，不然可能會有一些樣式上或者功能上的差別；

刪除<form> 標簽，替換為:{% form 'product', product %} ，如果form之前有一些屬性，我們還得加上，格式為：{% form 'product', product, id: "oldID", class: "old-class" %}，替換里面的oldID或者old-class；

接著搜索找到</form>，并替換為:{% endform %}；

然后搜索 input 或者 button 標簽找到add to cart按鈕，一般會帶有 type="submit"這個屬性；

在 Add to cart 按鈕的下面一行, 添加動態結賬按鈕的代碼:{{ form | payment_button }}

點擊保存，更改之后的form里面的內容應該類似：

{% form ‘product’, product %} … <button type=”submit”>Add to cart</button> {{ form | payment_button }} … {% endform %}

---

布局獨立站首選Shopify，現在注冊可享14天免費體驗+贈送價值$180精美模板一套+更多建站支持

Create your online store today with Shopify?www.shopify.com

原文請查閱云跨境官網

如何給Shopify店鋪添加“立即購買”動態結賬按鈕?www.yunecommerce.com

總結

以上是生活随笔為你收集整理的js动态给按钮赋id_如何给SHOPIFY店铺添加“立即购买”动态结账按钮的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。