如何使用鏈接 WooCommerce 替換“添加到購物車”按鈕

已發表: 2020-09-01

WooCommerce 使用鏈接替換添加到購物車按鈕 如果您想在 WooCommerce 中用鏈接替換添加到購物車按鈕,您必須了解添加到購物車的工作原理,因為它使用帶有產品參數的簡單 URL。 您可以創建 WooCommerce 添加到購物車鏈接,其工作方式與添加到購物車按鈕相同。 它簡單明了,不需要任何編碼知識即可用鏈接替換添加到購物車按鈕。

WooCommerce 添加到購物車鏈接

這篇文章將為您提供在 WooCommerce 中添加自定義“添加到購物車”URL 或鏈接的終極指南。 如果您正在尋找一種方法來創建自定義 WooCommerce 添加到購物車鏈接並使它們將產品添加到購物車或重定向到特定頁面。 完成此簡短教程後,您將能夠在自定義登錄頁面、定價表、博客文章等上放置“添加到購物車”鏈接。

但是,如果您需要 WooCommerce 的額外內容,您通常會發現 WooCommerce 無法滿足您的所有需求,例如,如果您想添加自定義的“添加到購物車”URL

如果您曾經與 WooCommerce 進行過互動,那麼您就會知道它是一個很棒的免費電子商務解決方案,它具有一組非常有用的功能。

突出的是 WooCommerce 在開發時考慮了可擴展性,類似於 WordPress 的模塊化。 因此,可以進行您需要的所有自定義,這就是為什麼您可以使用自定義鏈接輕鬆自定義“添加到購物車”按鈕的原因。

此外,我還將向您介紹一個免費插件,您可以使用它來實現此功能。 它將幫助您添加自定義添加到購物車按鈕標籤和鏈接。

用鏈接替換添加到購物車按鈕

說了這麼多,讓我們進入這個簡短教程最重要的部分,我將在其中與您分享一些我過去與之交互的自定義鏈接。 我希望這篇文章能對這個話題有所啟發。

a) 簡單產品添加到購物車 URL

老實說,與所有這些相比,這是最簡單的方法之一。 我已經說過,因為簡單的產品很容易使用自定義 URL 傳遞到購物車,稍後我將向您展示。 為此,您需要通過將鼠標懸停在產品標題上來查找產品 ID。 請按照以下簡單步驟操作:

在簡單產品中添加自定義添加到購物車 URL 的步驟

  1. 登錄您的 WordPress 站點並以管理員用戶身份訪問儀表板
  2. 從儀表板菜單中,單擊產品 > 所有產品。 這將打開您 WooCommerce 商店中的所有產品。
  3. 將鼠標懸停在您要添加自定義鏈接的產品上,查看產品 ID,如下所示: 產品編號
  4. 要將一個簡單的產品添加到購物車,請使用此鏈接:

href=”https://yourdomain.com/?add-to-cart=185”

記得更改鏈接中的域名,按鈕將立即可用。 ID 為 185 的產品將被添加到購物車中。

  1. 要購買數量為 3 的簡單產品到購物車,請使用此鏈接:

href=”https://yourdomain.com/?add-to-cart=185&quantity=3”

此鏈接表示將產品 ID 185 添加到購物車,數量為 3。還值得一提的是,您不能使用 URL 將兩種不同的產品添加到購物車。

  1. 要將一個簡單的產品添加到購物車並隨後重定向到購物車,請使用此鏈接:

href=”https://yourdomain.com/cart/?add-to-cart=185”

但是,您需要記住,如果您更改了購物車鏈接,您需要確保將“購物車”更改為“購物車”。 您還需要啟用AJAX 以在 WooCommerce 下的存檔選項上添加到購物車按鈕-> 設置 -> 產品 -> 常規,如圖所示: 加入購物車

請記住保存您所做的更改。

  1. 要將一個簡單的產品添加到購物車並隨後重定向到結帳,請使用此鏈接:

href= https://yourdomain.com/checkout/?add-to-cart=185”

但是,您需要記住,要使其正常工作,您必須啟用AJAX 以添加到存檔上的購物車按鈕選項,並在 WooCommerce –> 設置 –> 產品 –> 常規下禁用成功添加後重定向到購物車頁面選項,如圖所示以下: 禁用重定向

請記住保存您所做的更改。

  1. 要將一個簡單的產品添加到購物車並隨後重定向到任何頁面,請使用此鏈接:

href= https://yourdomain.com/your_custom_page/?add-to-cart=185”

但是,您需要記住,要使其正常工作,您必須啟用AJAX 以添加到存檔上的購物車按鈕選項,並在 WooCommerce –> 設置 –> 產品 –> 常規下禁用成功添加後重定向到購物車頁面選項,如圖所示多於。

b) 將可變產品添加到購物車 URL

過去,可變產品很難配置,但使用當前版本的 WooCommerce,就很容易了。 要添加自定義 URL,您只需要變體 ID,您可以查看以下步驟以了解在哪裡可以找到它。

在可變產品中添加自定義添加到購物車 URL 的步驟

  1. 登錄您的 WordPress 站點並以管理員用戶身份訪問儀表板
  2. 從儀表板菜單中,單擊產品 > 所有產品。 這將打開您 WooCommerce 商店中的所有產品。
  3. 將鼠標懸停在要添加自定義鏈接的變量產品上,以檢查產品 ID。
  4. 單擊編輯並向下滾動到產品數據以找到可變產品 ID,如下所示: 變體 ID 用鏈接替換添加到購物車按鈕

現在我們有了變體 ID,您可以使用它來創建自定義鏈接,如下所示。

  1. 要將一個可變產品添加到購物車,請使用此鏈接:

href= https://yourdomain.com/?add-to-cart=149”

只需在末尾添加可變產品 ID。 就是這麼簡單。

  1. 要將一個數量為 3 的可變產品添加到購物車,請使用此鏈接:

href= https://yourdomain.com/?add-to-cart=149&quantity=3”

  1. 要將一個可變產品添加到購物車並重定向到購物車,請使用此鏈接:

href= https://yourdomain.com/cart/?add-to-cart=149”

  1. 要將一個可變產品添加到購物車並重定向到結帳,請使用此鏈接:

href= https://yourdomain.com/checkout/?add-to-cart=149”

  1. 要將一個可變產品添加到購物車並重定向到任何頁面,請使用此鏈接:

href= https://yourdomain.com/any-page-URL/?add-to-cart=149”

如果您的 WooCommerce 商店有分組產品,您還可以將自定義鏈接添加到“添加到購物車”按鈕。 分組產品可以定義為兩個或多個子產品的組合,每個子產品都可以添加自定義數量到購物車。

將自定義 URL 添加到分組產品的步驟。

按照這些簡單的步驟將自定義 URL 添加到分組產品。

  1. 為此,您需要以與第一個和第二個相同的方式找到分組產品 ID。
  2. 然後將 ID 添加到自定義 URL 中,如下所示:

href= https://yourdomain.com/?add-to cart=451&quantity[103]=5&quantity[193]=2”

這意味著我們添加了 Grouped Product ID = 451,具體來說,我們添加了 5 倍的產品 ID = 103 和 2 倍的產品 ID=2。 您可以添加一個零來指定數量。

結論

我希望本教程可以幫助您將自定義鏈接添加到“添加到購物車”按鈕。 我已經教您如何將自定義 URL 添加到簡單產品、可變產品和分組產品。 請務必記住,您需要在鏈接中添加您的域名,並在必要時添加正確的頁面 URL。 我希望這篇文章能幫助您更多地了解 WooCommerce 添加到購物車的工作原理,並且您可以自定義它們以滿足您作為自定義 URL 的需求。

類似評論