如何在 WooCommerce 中編輯支付網關
已發表: 2022-08-04設置支付網關是您在構建 WooCommerce 商店時應該完全弄清楚的第一件事。 當您的客戶需要支付購買費用時,銀行轉帳並不總是可靠或方便的選擇。 這就是為什麼我們QuadLayers為您帶來瞭如何在 WooCommerce 中編輯 WooCommerce 支付網關的指南。
為什麼要編輯 WooCommerce 支付網關?
在維護轉換方面,擁有易於使用的支付網關來幫助您順利結帳過程非常重要。 您不僅希望為您的產品提供可訪問的支付網關,還希望您的客戶信任您的支付系統。 如今,在線支付可能存在很多風險,如果客戶對您的商店沒有 100% 的信任,他們在購買時會更加謹慎。
這就是為什麼我們的指南將涵蓋您在 WooCommerce 中編輯支付網關的所有方法,以提供更清晰的信息並贏得客戶的信任。 無論您是添加新的付款方式還是對其進行自定義,您都必須確保您的客戶也能從您的商店獲得最佳的用戶體驗。 因此,如果需要,您還可以選擇添加支付網關圖標和徽章。
我們今天將涵蓋所有這些內容以及更多內容。 但在此之前,讓我們看一下默認 WooCommerce 選項來編輯支付網關。
如何在 WooCommerce 中編輯支付網關
您可以通過 3 種主要方式編輯您的 WooCommerce 支付網關:
- 默認 WooCommerce 儀表板
- 以編程方式
- 使用插件
首先,讓我們看看如何使用默認的WooCommerce 儀表板管理您的支付網關。
1. 使用默認選項在 WooCommerce 中編輯支付網關
要開始為您的 WooCommerce 支付網關使用默認選項,您需要先進行設置。
1.1。 設置支付網關
打開您的WP 管理員儀表板,然後單擊WooCommerce > 設置 > 付款。 在這裡,您將看到為您的網站啟用的所有支付網關。 默認情況下,您應該會看到支票、銀行轉賬和貨到付款等選項。
您可以通過單擊啟用切換選項啟用/禁用任何這些選項。 點擊它,相應的支付網關將被禁用。 您還可以拖動任何支付網關來重新排列它們的位置。 這樣,您還可以編輯這些網關在前端提供給客戶的順序。
當然,您也可以使用此儀表板設置其他付款方式,例如 PayPal 和 Stripe。 如果您願意,可以查看這些指南以獲得更好的設置說明:
- 使用 Stripe 設置 WooCommerce
- 使用 PayPal 設置 WooCommerce
1.2. 使用默認 WooCommerce 選項管理支付網關
默認情況下,WooCommerce 允許您自定義有關支付網關的一些詳細信息。 例如,如果我們點擊貨到付款管理,您將能夠訪問以下選項:
- 標題:使用標題字段更改用戶在結帳時看到的支付網關的標題/文本。
- 說明:使用此字段,您可以添加簡短但清晰的說明,說明付款方式的運作方式以及您將如何處理付款。
- 說明:有關如何根據支付網關處理付款和轉賬/付款的附加說明。
使用貨到付款支付網關,您只能啟用特定運輸方式的支付網關。 例如,我們將此字段設置為僅本地取貨,因此貨到付款僅在客戶選擇本地取貨作為送貨方式時才會顯示。
填寫這些詳細信息後,您認為合適,然後單擊保存更改。 然後,您的支付網關將成功更新。 現在,您將能夠看到我們定制的結果:
雖然這足以在一定程度上自定義您的支付網關,但您還可以通過一些額外的步驟獲得更好的編輯選項。 它們可以通過編程或使用插件進一步修改。
2. 以編程方式在 WooCommerce 中編輯支付網關
如果您有基本的編程技術理念,您也可以以編程方式編輯 WooCommerce 支付網關。 但是要自定義您的支付網關,您需要使用 WooCommerce 掛鉤使用您的支付 ID 。 然後,我們可以使用支付 ID 來修改您的支付網關。
首先,讓我們看看如何找到您的支付網關 ID。
2.1。 如何查看您的支付網關 ID
為此,您必須訪問您的functions.php主題文件。 但是,我們建議使用子主題,因為它更安全,並且當您更新主主題時,您的主題文件不會更改或恢復。 所以,繼續並切換到您的孩子主題。 如果您需要進一步的幫助,您甚至可以使用 WordPress 的子主題插件之一。
我們還想提醒您在開始之前備份您的網站,因為我們將更改您商店的核心文件。 因此,對它們的任何不需要的更改都可能導致您的網站出現進一步的問題。
然後,通過單擊 WordPress 儀表板中的外觀 > 主題文件編輯器來打開主題編輯器。
現在,從屏幕右上角的主題文件中單擊functions.php 。
使用中間的文件編輯器,將以下腳本複製到編輯器中:
add_filter('woocommerce_payment_gateways_setting_columns', 'QL_add_payment_method_column'); 功能 QL_add_payment_method_column( $default_columns ) { $default_columns = array_slice( $default_columns, 0, 2 ) + array( 'id' => 'ID' ) + array_slice( $default_columns, 2, 3 ); 返回 $default_columns; } // woocommerce_payment_gateways_setting_column_{COLUMN ID} add_action('woocommerce_payment_gateways_setting_column_id', 'QL_populate_gateway_column'); 函數 QL_populate_gateway_column( $gateway ) { 迴聲'<td>'。 $網關->id 。 '</td>'; }
將其粘貼到編輯器中,然後單擊Update File 。 這將在您的付款列表中添加一列,顯示您的付款網關 ID。 要查看此列表,請單擊WooCommerce > 設置 > 付款。
2.2. 以編程方式編輯支付網關標題
您現在可以使用此ID自定義支付網關的標題和描述。 您可以使用以下腳本更改支付網關的標題:
add_filter('woocommerce_gateway_title', 'QL_change_payment_gateway_title', 25, 2); 功能 QL_change_payment_gateway_title( $title, $gateway_id ){ 如果(“鱈魚”=== $gateway_id){ $title = '在此處插入文本'; } 返回$標題; }
在這裡,您需要做的就是將 if 語句中的“cod”替換為您要自定義的支付網關的ID 。 然後,替換$title參數中的Insert-Text-Here部分以使用您的自定義文本作為標題。
例如,我們有用於直接銀行轉帳付款的 ID。 所以,我們取上面幾行代碼,把 cod 換成 bacs。 接下來,我們可以將自定義文本“轉賬”添加到我們的美國銀行賬戶(僅限美國居民)。 ' 現在,代碼應該如下所示:
add_filter('woocommerce_gateway_title', 'QL_change_payment_gateway_title', 25, 2); 功能 QL_change_payment_gateway_title( $title, $gateway_id ){ 如果('bacs' === $gateway_id){ $title = '轉賬到我們的美國銀行賬戶(僅限美國居民)'; } 返回$標題; }
有了這個,我們的前端結賬應該是這樣的:
2.2. 以編程方式編輯支付網關描述
您還可以使用gateway_id的類似功能添加自定義描述文本。 只需替換以下腳本中的“ Insert-text-here ”部分即可:
add_filter('woocommerce_gateway_description', 'QL_change_payment_gateway_description', 25, 2); 功能 QL_change_payment_gateway_description( $description, $gateway_id ) { 如果('bacs' === $gateway_id){ // 你可以在這裡使用 HTML 標籤 $description = '這裡是自定義付款的演示文本;)'; } 返回$描述; }
在這裡,您可以在我們的演示結帳中看到我們的自定義文本:
2.2.1。 在您的支付網關描述中使用 HTML 標籤
您甚至可以使用HTML 標記添加圖像,甚至可以使用此代碼添加指向特定頁面的鏈接。 這將簡單地使用 HTML 標記編輯文本。 但是,我們要求用戶僅在他們感到滿意時才使用 HTML 標記。 例如,要將我們的客戶引導到我們的 TOS 頁面,我們可以使用如下代碼:
add_filter('woocommerce_gateway_description', 'QL_change_payment_gateway_description', 25, 2); 功能 QL_change_payment_gateway_description( $description, $gateway_id ) { 如果('bacs' === $gateway_id){ // 你可以在這裡使用 HTML 標籤 $description = '<a href = "http://localhost/wpsite/terms-and-conditions/">此處用於自定義支付的演示文本</a>'; } 返回$描述; }
使用此代碼,我們的描述文本還將鏈接到我們的條款和條件頁面,該頁面可用於為客戶提供有關付款以及任何可用退款或回扣的更多詳細信息。
這涵蓋瞭如何以編程方式在 WooCommerce 中編輯支付網關。 如您所見,使用代碼編輯和自定義支付網關仍然有點棘手。 如果您不習慣在主題中添加自定義功能,這可能會特別困難。
這就是為什麼我們還為您提供了使用插件編輯支付網關的指南。
3. 使用插件在 WooCommerce 中編輯支付網關
使用插件,編輯支付網關的過程變得更加容易和用戶友好。 您可以使用特定插件獲得許多高級功能。 其中一些甚至包括根據產品或產品類別顯示/隱藏付款方式的能力。
但是對於我們今天的演示,我們將為WooCommerce 插件使用按產品/類別/標籤的支付網關。 該插件非常簡單,顧名思義,它允許您啟用或禁用特定產品、類別或標籤的特定支付網關。
3.1。 安裝並激活插件
讓我們從安裝和激活插件開始。 首先,打開您的WP Admin Dashboard並單擊Plugins > Add New 。
然後,使用右上角的搜索欄並蒐索插件的關鍵字。 單擊插件選項卡上的立即安裝以安裝插件。
要激活插件,您可以在按鈕切換到激活時單擊激活。 或者,您可以單擊側邊欄上的許多插件,然後手動單擊插件列表下的激活。
但是,如果您想使用任何高級插件,則必須手動安裝該插件。
3.2. 配置插件設置
要使用該插件,您需要通過單擊WooCommerce > Settings > Payment Gateways per product打開插件的選項。 在這裡,您可以使用三個不同的選項卡:每個產品類別、每個產品標籤和每個產品。
所有這些功能都需要類似的步驟。 讓我們首先演示如何使用Per Products Categories選項卡。 單擊每個產品類別,您將獲得所有可用支付網關的列表。
在這裡,您可以使用包含和排除字段來隱藏/顯示特定產品類別的支付網關。 您可以使用 Include 字段選擇哪些產品將顯示相應的支付網關。 相反,使用排除讓我們隱藏特定產品的支付網關。
如果您想為具有不同利潤率或成本的產品禁用某些支付網關,這非常有效。 因此,例如,如果我們想要禁用特定虛擬產品的貨到付款,我們可以簡單地在貨到付款的排除字段中輸入產品類別的名稱。 完成後,單擊保存更改。
對於演示,我們可以看到我們的結賬時禁用了貨到付款支付網關,因為我們的購物車中有一個虛擬產品。
同樣,您也可以在類似中使用Include標籤來顯示特定類別的支付網關。 對於包含選項,我們可以添加家具類別,因此如果我們的購物車中有匹配的產品,則會顯示該選項。
現在,如果我們添加我們的演示家具產品,我們將在結賬時為我們啟用支付網關:
在 WooCommerce 中禁用付款方式
WooCommerce 還允許您輕鬆禁用付款方式。 此外,您甚至可以選擇使用智能方法來禁用它們,使用購物車條件、帳單地址等。 首先,讓我們看看如何在 WooCommerce 中禁用付款方式。
為此,首先轉到WooCommere > 設置 > 付款。 在這裡,您可以看到每個支付網關旁邊的已啟用列。 單擊付款方式旁邊的啟用/禁用按鈕以禁用它。 然後,單擊保存更改。
這是禁用支付網關的一種極其簡單的方法。 但是,假設您想使用更詳細的案例和條件來停用支付網關。 在這種情況下,您可以使用自定義 WooCommerce 功能和插件來實現。
例如,如果您想使用購物車總價值禁用支付網關,您可以使用簡單的 WooCommerce 功能來實現。 該代碼檢查您的購物車總數是否超過 200,如果是,它將禁用該特定訂單的貨到付款。 這是阻止您無法處理的特定支付網關的大量支付的絕佳方式。
因此,要使用此代碼,請通過單擊 WordPress 儀表板中的外觀 > 主題文件編輯器,打開我們在上面突出顯示的functions.php 。
然後,將此腳本粘貼到編輯器中,然後單擊更新文件。
add_filter('woocommerce_available_payment_gateways','quadlayers_disable_paypal_above_100'); 功能 quadlayers_disable_paypal_above_100( $available_gateways ) { $最大值 = 200; if ( WC()->cart->total > $maximum ) { 未設置($available_gateways['cod']); } 返回$available_gateways; }
這只是在 WooCommerce 中禁用支付網關的一種方法。 如果您正在尋找使用其他條件(如購物車商品、地址、用戶角色等)的方法,我們建議您在此處查看我們的指南,了解如何在 WooCommerce 中禁用支付網關。
獎勵:如何為您的支付網關添加自定義信任徽章
信任徽章是清楚表明您支持特定支付網關並已通過這些服務驗證的好方法。 這樣,如果您啟用了 Paypal 或 Stripe 等支付網關,您可以為其添加漂亮的小圖像。
添加信任徽章的最快方法是將以下小腳本添加到您的子主題的 functions.php 文件中。 因此,再次單擊外觀 > 主題文件編輯器,然後單擊右側主題文件側邊欄上的functions.php 。
之後,粘貼以下代碼並單擊更新文件。
add_action('woocommerce_after_cart_totals', 'add_content_on_cart'); 功能 add_content_on_cart() { echo "<img src='https://www.nicepng.com/png/full/313-3136141_add-to-cart-checkout-trust-badges-shopify-png.png' >"; } add_action('woocommerce_review_order_after_payment', 'add_content_on_checkout'); 功能 add_content_on_checkout() { echo "<img src='https://www.nicepng.com/png/full/313-3136141_add-to-cart-checkout-trust-badges-shopify-png.png' >"; }
現在應該在您的結帳中添加一個信任徽章,如下所示:
此外,如果您願意更改 HTML 代碼,您可以創建自定義徽章,將其上傳到您的網站並使用 src 屬性鏈接它。
結論
我們關於如何在 WooCommerce 中編輯支付網關的指南到此結束。 為了讀者的方便,我們將快速總結我們在這篇文章中經歷的所有要點:
- 使用 WooCommerce 儀表板編輯支付網關
- 以編程方式編輯支付網關的標題和描述
- 使用插件編輯特定產品類別的支付網關
- 在 WooCommerce 中禁用支付網關
- 將信任徽章添加到您的 WooCommerce 付款部分
當然,編輯支付網關的最簡單方法是直接從 WooCommerce 儀表板或使用插件。 雖然 WooCommerce 儀表板是最簡單的方法,但儀表板可能沒有您需要的正確功能範圍。
如果您對初學者更友好,我們強烈建議您使用插件,並且您不一定必須使用我們演示的插件。 以我們的指南作為參考并快速查看您的插件文檔,您應該很快就會好起來。 但是,如果有任何困惑,您可以在評論部分向我們尋求幫助。
此外,如果您正在尋找其他方法來改善客戶的結帳體驗,何不在這裡查看我們的其他指南:
- 如何將產品圖片添加到 WooCommerce Checkout
- 如何在 WooCommerce 中更改繼續結帳文本
- QuadLayers 添加和使用 WooCommerce 運輸類的指南