建站
咨詢
售后
建站咨詢
新聞中心
WooCommerce是一個靈活而強大的插件，您可以使用它來將您的wordpress網(wǎng)站變成一個動態(tài)的電子商務(wù)商店。但是，如果您希望減少購物車放棄、推動轉(zhuǎn)化和增加收入，請務(wù)必注意您的WooCommerce結(jié)算頁面。
在WooCommerce中有很多不同的方式來設(shè)置和編輯結(jié)帳頁面。無論您是開始您的第一家在線商店并試圖了解此頁面的工作原理，還是您想增強現(xiàn)有WooCommerce網(wǎng)站上的結(jié)算體驗，我們都能滿足您的需求。
在這篇文章中，我們將解釋WooCommerce結(jié)算頁面是什么以及它的功能。然后，我們將引導(dǎo)您了解使用插件、代碼、主題等來優(yōu)化轉(zhuǎn)化所需的樣式、更改和利用它的許多選項。
WooCommerce結(jié)算頁面概述
當您第一次設(shè)置WooCommerce商店時，該插件會自動創(chuàng)建并分配一個結(jié)帳頁面。如果您在網(wǎng)站的前端預(yù)覽它，您會發(fā)現(xiàn)它相當簡單：
默認的WooCommerce結(jié)算頁面
默認情況下，WooCommerce會要求客戶提供一些基本信息。這包括：
- 結(jié)算明細
- 名字和姓氏
- 公司名
- 地址（城鎮(zhèn)/城市、國家、地區(qū)和郵政編碼/郵政編碼）
- 電話號碼
- 電子郵件地址
- 訂單備注
- 隱私政策聲明
這是包含在WooCommerce結(jié)算頁面上的重要信息。它提供了客戶完成購買以及網(wǎng)站處理其付款信息所需的詳細信息。
但是，這里沒有任何東西必然有助于提高轉(zhuǎn)化率或減少結(jié)算放棄。此外，默認頁面可能無法為您的特定業(yè)務(wù)提供最相關(guān)或最有用的信息。因此，像許多WooCommerce網(wǎng)站所有者一樣，您可能希望更改結(jié)帳頁面的設(shè)計和內(nèi)容。
在我們進入您可以在WooCommerce中自定義結(jié)算頁面的不同方式之前，首先要了解一些事情。
讓我們談?wù)勗谀睦锟梢哉业酱隧撁?，以及WooCommerce插件中可用的各種默認設(shè)置和功能。
在哪里可以找到默認的WooCommerce結(jié)算頁面和設(shè)置
激活插件后，WooCommerce會自動為您的商店創(chuàng)建結(jié)算頁面。您可以通過在管理儀表盤中導(dǎo)航到Pages > Checkout來找到它：
WooCommerce中的結(jié)算頁面
您可以像編輯任何WordPress內(nèi)容一樣編輯此頁面。例如，您可以更改頁面的標題和固定鏈接、添加特色圖片、修改頁面屬性等。它還使用[woocommerce_checkout] 短代碼：
WordPress中的WooCommerce結(jié)算頁面短代碼
有一些標準選項可用于配置此頁面，其中一些您可以在WooCommerce > Settings > Advanced下找到：
WooCommerce設(shè)置中的“Advanced”選項卡
在此屏幕上的Page Setup部分下，您可以選擇不同的頁面用作商店的結(jié)帳屏幕。您還可以選擇強制使用安全的HTTPS連接。
在General設(shè)置頁面上，您可以啟用在結(jié)帳時使用優(yōu)惠券，并配置如何計算稅款：
WooCommerce中的常規(guī)設(shè)置頁面
在Accounts & Privacy選項卡下，您還可以找到一些用于創(chuàng)建帳戶和訪客結(jié)算的選項：
WooCommerce設(shè)置的“帳戶和隱私”選項卡
在其下方，有一個Privacy policy部分，您可以在其中修改結(jié)帳頁面上顯示的隱私政策文本：
WooCommerce中的隱私政策設(shè)置
除了這些內(nèi)置設(shè)置之外，您僅使用WooCommerce插件自定義結(jié)帳頁面的選項有限。幸運的是，您可以使用其他方法來增強其外觀并擴展其功能。
為什么您可能想要更改您的WooCommerce結(jié)算頁面
結(jié)帳頁面是客戶在完成購買之前看到的最后一件事。它可以決定他們最終是轉(zhuǎn)換還是完全放棄您的網(wǎng)站。
因此，確保您的WooCommerce結(jié)算頁面設(shè)計良好并以鼓勵轉(zhuǎn)化的方式運行至關(guān)重要。您可以通過多種方式提供更好的體驗，例如：
- 更改設(shè)計和頁面模板
- 創(chuàng)建單頁結(jié)算
- 添加、刪除或重新排列字段
- 更改輸入字段標簽和按鈕文本
- 要求填寫某些字段
- 自動觸發(fā)免運費
- 將產(chǎn)品直接鏈接到結(jié)帳頁面
無論您是想徹底檢查默認頁面還是進行細微修改，重要的是您能夠輕松地做到這一點。幸運的是，您有多種選擇。
可用于更改WooCommerce結(jié)算頁面的方法
有很多方法可以更改您的WooCommerce結(jié)算頁面。最好的使用取決于幾個因素，例如您嘗試進行的特定編輯以及您對編碼的舒適程度。
您可以用來增強WooCommerce結(jié)算頁面的一些方法包括：
- WooCommerce功能、塊和簡碼。WooCommerce確實帶有一些可用于改善商店的內(nèi)置功能和設(shè)置。例如，您可以自動觸發(fā)免費送貨，以及將產(chǎn)品直接鏈接到結(jié)帳頁面。還有用于修改頁面的塊和簡碼。
- 插件和擴展。如果您不精通技術(shù)，或者只是想要一種快速輕松的方式來增強您的WooCommerce結(jié)算頁面，那么您可以使用很多插件。大多數(shù)都很容易上手，幾乎不需要支持。一些附加組件由WooCommerce提供，可從擴展庫中獲得，而其他附加組件由第三方平臺開發(fā)和提供。
- 頁面模板和主題。 如果要更改結(jié)算頁面的樣式，可以使用預(yù)構(gòu)建的模板或主題。與插件一樣，如果您的編碼經(jīng)驗有限并且想要更改頁面的整體外觀以更好地匹配您的品牌，這是一個不錯的選擇。缺點是它沒有提供像自定義編碼那樣的靈活性。
- 自定義代碼。您可以用來更改WooCommerce結(jié)算頁面的另一種方法是自定義編碼。如果您喜歡編輯站點文件并希望添加大量個性化設(shè)置，這是一條強大的途徑。
在以下部分中，我們將看看您可以對WooCommerce頁面進行的一些最有效的更改。對于每個，我們將解釋您可能想要進行編輯的原因，并引導(dǎo)您了解可用于進行編輯的不同方法。
如何自定義WooCommerce結(jié)算字段
您可能對WooCommerce頁面進行的最常見更改之一是修改其表單字段。這些通常占用頁面上的大部分空間，因此它們需要相關(guān)。無論您是要刪除字段、重新排列它們的順序，還是添加新的自定義字段，您都有幾個選項可以進行。您可以使用插件或直接編輯代碼。
使用插件更改WooCommerce結(jié)算字段
如果您想要一種快速簡單的方法來自定義WooCommerce中的結(jié)算字段，我們建議您使用插件。有幾個選項可供選擇。
最受歡迎的插件之一是Checkout Field Editor插件：
WooCommerce插件-Checkout Field Editor
這是一個免費增值工具，可讓您在WooCommerce結(jié)算頁面上添加或編輯表單字段。您可以啟用或禁用某些字段，以及重新排列它們的順序。
雖然免費版本可以讓您處理這些基本任務(wù)，但WooCommerce Checkout Field Editor Pro帶有附加功能。這包括17種字段類型和自定義掛鉤。
要使用此插件，您可以通過導(dǎo)航到 插件> 安裝插件 然后搜索它來將其安裝在您的WooCommerce網(wǎng)站上。找到它后，單擊立即安裝按鈕，然后單擊激活。
激活后，您可以通過轉(zhuǎn)到WooCommerce > Checkout Form來配置設(shè)置：
WooCommerce中的結(jié)算表單編輯器插件
您可以編輯三種不同類型的字段：
您可以選擇要更改的任何字段，然后單擊Remove、 Enable或Disable按鈕。要添加新字段，請選擇Add field。
如果要更改現(xiàn)有表單域，請選擇左側(cè)的框，然后單擊“Edit”按鈕。將打開一個面板，您可以在其中更改字段類型（僅限高級版）、編輯字段標簽、選擇是否需要，等等：
WooCommerce Checkout Field Editor插件中的編輯結(jié)帳字段面板
完成后，單擊“SAVE”按鈕。完成對結(jié)帳頁面字段的所有更改后，請務(wù)必點擊屏幕底部的保存更改。
有關(guān)更詳細的指導(dǎo)，您可以參考WooCommerce關(guān)于使用Checkout Field Editor插件的文檔。
當然，這只是您可以用來更改WooCommerce結(jié)算字段的眾多插件之一。值得考慮的其他選項包括Flexible Checkout Fields和 WooCommerce Checkout Manager，我們將在本文后面進行更多討論。
使用代碼編輯結(jié)算字段
在WooCommerce結(jié)算頁面上編輯字段的另一個選項是使用自定義編碼。當然，這需要一定程度的技術(shù)知識和使用站點文件的舒適度。優(yōu)點是您在自定義方面比使用第三方插件具有更大的靈活性。
您可以使用站點的functions.php文件和過濾器來編輯結(jié)算字段 ，例如：
- woocommerce_checkout_fields
- woocommerce_billing_fields
- Woocommerce_shipping_fields
WooCommerce actions 和 filters可讓您以幾乎任何您希望的方式操作結(jié)算字段。例如，您可以完全刪除它們、添加新的或更改顯示的文本。使用woocommerce_checkout_fields 過濾器將使您能夠覆蓋任何字段。
假設(shè)您要更改order_comments字段的占位符文本。默認情況下，它設(shè)置如下：
_x('Notes about your order, e.g. special notes for delivery.', 'placeholder', 'woocommerce')
要更改它，您可以將此代碼片段添加到您的functions.php 文件中：
// Hook in
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
// Our hooked in function - $fields is passed via the filter!
function custom_override_checkout_fields( $fields ) {
$fields['order']['order_comments']['placeholder'] = 'My new placeholder';
return $fields;
}
要刪除字段，您可以使用以下命令：
// Hook in
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
// Our hooked in function - $fields is passed via the filter!
function custom_override_checkout_fields( $fields ) {
unset($fields['order']['order_comments']);
return $fields;
您可以對結(jié)算頁面上的字段進行許多更改，因此我們不會在此處一一探討。您可以在GitHub上找到有用的覆蓋結(jié)算字段代碼列表。
如何更改WooCommerce結(jié)算頁面模板
默認情況下，您的WooCommerce結(jié)算頁面模板將基于您網(wǎng)站的主題。但也許您想更改設(shè)計以更好地適應(yīng)您的品牌，或者您可能只想對模板頁面的內(nèi)容進行輕微更改。
您可以用來更改此設(shè)置的兩種主要方法是使用預(yù)構(gòu)建的模板或添加代碼。讓我們從前者開始。
從預(yù)建模板開始自定義結(jié)算頁面
更改WooCommerce結(jié)算頁面設(shè)計的最簡單方法是安裝預(yù)構(gòu)建的主題，例如WooCommerce主題商店中的主題。有多種免費選項以及高級主題可供選擇。
例如，您可以搜索單頁結(jié)算主題或您有興趣使用的任何其他類型的特定模板。您還可以在Envato Market上找到大量WooCommerce主題。
使用代碼自定義WooCommerce結(jié)算頁面模板
如果您喜歡編輯代碼，您還可以手動更改結(jié)帳頁面模板。根據(jù)您的托管服務(wù)提供商，您可以通過cPanel中的文件管理器或安全文件傳輸協(xié)議 (SFTP) 客戶端來執(zhí)行此操作。
您可以使用動作掛鉤從結(jié)帳頁面添加、編輯或刪除元素。WooCommerce用于結(jié)算頁面的主要動作鉤子有九個：
- woocommerce_before_checkout_form
- woocommerce_checkout_before_customer_details
- woocommerce_checkout_billing
- woocommerce_checkout_shipping
- woocommerce_checkout_after_customer_details
- woocommerce_checkout_before_order_review
- woocommerce_checkout_order_review
- woocommerce_checkout_after_order_review
- Woocommerce_after_checkout_form
這些操作掛鉤向頁面添加標記，您可以使用這些標記來自定義其樣式和功能。如果您想使用這些操作掛鉤來修改您的結(jié)帳頁面模板，您可以通過編輯結(jié)算表單PHP文件來實現(xiàn)。
您可以在/woocommerce/templates下找到WooCommerce模板文件。從您網(wǎng)站的根目錄，您需要導(dǎo)航到wp-content/plugins/woocommerce：
WooCommerce模板文件夾
在這些文件中，您可以使用掛鉤在模板頁面上添加和重新排列內(nèi)容，而無需實際編輯模板文件。要為結(jié)帳頁面創(chuàng)建自定義主題模板，您首先需要在主題文件夾中創(chuàng)建一個“woocommerce/checkout”文件夾。
接下來，復(fù)制WooCommerce結(jié)算頁面模板，您可以在woocommerce/templates/checkout/form-checkout.php找到該模板：
WooCommerce結(jié)算頁面模板文件
然后，將其添加到您剛剛創(chuàng)建的新文件夾中。之后，您可以編輯文件以進行所需的更改。當您保存文件時，WooCommerce插件將加載此模板并覆蓋默認頁面模板。
如何創(chuàng)建單頁WooCommerce結(jié)算
增強客戶結(jié)算體驗并在此過程中降低放棄率的方法之一是使其盡可能快速和簡單。如果您想縮短結(jié)算流程，可以通過在WooCommerce中創(chuàng)建單頁結(jié)帳來實現(xiàn)。
有多種方法可以做到這一點。正如我們之前提到的，您可以尋找將提供單個結(jié)算頁面的單頁主題或模板。但是，如果您喜歡當前的主題，您可能不想更改它。
如果是這種情況，請不要擔心。還有其他選項，例如高級WooCommerce One Page Checkout擴展：
WooCommerce單頁結(jié)算擴展
由于此解決方案是由WooCommerce開發(fā)的，因此您知道它安全、可靠并提供大量支持。除了讓您將任何頁面轉(zhuǎn)換為結(jié)帳頁面之外，它還具有許多用于優(yōu)化單頁結(jié)帳流程的功能。
你可以：
- 在一頁上顯示產(chǎn)品選擇和結(jié)算表格。
- 使客戶能夠在他們的購物車中添加或刪除商品。
- 讓客戶在不離開頁面的情況下完成付款。
- 向頁面添加自定義字段。
通過您的WooCommerce帳戶購買擴展程序后，您可以下載該插件，然后在您的 WooCommerce 網(wǎng)站上安裝并激活它。
要使用它，請導(dǎo)航到Pages > Add New并在編輯器工具欄中選擇One Page Checkout圖標：
WordPress編輯器中的One Page Checkout擴展圖標
在打開的面板中，您可以單擊“Products” 字段，然后開始輸入要添加的產(chǎn)品的名稱。
接下來，選擇您要使用的模板（產(chǎn)品列表、產(chǎn)品表、定價表或單個產(chǎn)品），然后單擊Create Shortcode。
您還可以手動將單頁短代碼插入任何文章或頁面。要了解有關(guān)此插件的更多信息以及如何使用它，您可以參考WooCommerce One Page Checkout文檔。
如何在WooCommerce結(jié)算過程中觸發(fā)免費送貨
作為電子商務(wù)企業(yè)主，您可以利用許多不同的策略來鼓勵客戶增加消費。其中之一是提供免費送貨。
當然，您可能不想為每個訂單提供免費送貨服務(wù)。但是，將其作為對達到一定數(shù)量的訂單總額的激勵措施可以幫助您鼓勵購物者花費更多。
因此，您可能希望將您的WooCommerce結(jié)算頁面配置為自動觸發(fā)超過一定數(shù)量（例如100美元）的訂單的免費送貨。
您需要做的第一件事是向相關(guān)Shipping Zone(s)提供免費送貨方式。
為此，請導(dǎo)航至WooCommerce > Settings > Shipping：
WooCommerce送貨設(shè)置
將鼠標懸停在您要修改的運輸區(qū)域上，然后單擊Edit鏈接。如果您尚未添加任何區(qū)域，請先選擇 添加 Add shipping zone button，然后按照提示繼續(xù)操作。
接下來，單擊Add Shipping Method。在打開的模式中，從下拉菜單中選擇Free Shipping，然后再次Add shipping method ：
在WooCommerce中添加免費送貨方式
接下來，從設(shè)置頁面的Shipping methods列表中，將鼠標懸停在Free Shipping上 ，然后單擊Edit鏈接。
Free shipping settings面板將打開。從Free shipping requires…下拉菜單，選擇A minimum order amount :
WooCommerce中的免費送貨設(shè)置
然后，您可以定義最小訂單金額。完成后，單擊“保存更改”按鈕。
如何將產(chǎn)品直接鏈接到WooCommerce結(jié)算頁面
增強客戶結(jié)算體驗的另一種方法是創(chuàng)建直接結(jié)算鏈??接。這有助于讓客戶直接從產(chǎn)品和銷售頁面結(jié)算。
手動創(chuàng)建直接結(jié)帳鏈接
要在WooCommerce中創(chuàng)建和添加直接結(jié)帳鏈接，您可以使用以下 URL：exampledomain.com//checkout/ ?add-to-cart=ID 。
注意：您需要將“exampledomain”和“ID”替換為您的域名和您鏈接到結(jié)帳頁面的特定產(chǎn)品 ID。
要查找產(chǎn)品ID，請導(dǎo)航到管理儀表板中的Products > All Products。瀏覽到您要為其創(chuàng)建直接鏈接的產(chǎn)品，然后將鼠標懸停在其名稱上以顯示產(chǎn)品ID號：
WooCommerce產(chǎn)品ID
將產(chǎn)品ID粘貼到上述URL后，您可以將鏈接放在WooCommerce網(wǎng)站的任何位置。您可以為每個產(chǎn)品重復(fù)此過程，甚至是可變和分組的項目。
使用插件創(chuàng)建直接結(jié)帳鏈接
我們意識到上述策略可能不是對所有用戶最有效的方法。根據(jù)您在WooCommerce商店中擁有的產(chǎn)品數(shù)量，這可能非常耗時。
幸運的是，如果您正在尋找一種更快的方法，您還可以使用Direct Checkout for WooCommerce插件：
WooCommerce插件Direct Checkout
這款免費增值工具可讓您以多種方式簡化結(jié)算流程，包括添加從產(chǎn)品頁面到結(jié)算屏幕的直接鏈接。在您的WooCommerce網(wǎng)站上安裝并激活插件后，導(dǎo)航至WooCommerce > Direct Checkout：
WooCommerce插件設(shè)置的直接結(jié)帳
在General選項卡下， 為已Added to cart redirect選項選擇Yes，然后從Added to cart redirect to下拉菜單中選擇Checkout。完成后單擊保存更改 。
接下來，導(dǎo)航到Products選項卡：
在WooCommerce的Direct Checkout中重定向到購物車的選項
啟用添加成功后重定向到購物車頁面選項。再次單擊保存更改按鈕。而已！
如何測試您的WooCommerce結(jié)帳頁面
在這一點上，您希望實現(xiàn)了多種方法來增強您的WooCommerce結(jié)帳頁面?，F(xiàn)在，必須確保您的結(jié)帳流程正常運行，以減少放棄并確認沒有錯誤會中斷客戶旅程。
幸運的是，有一種簡單的方法可以讓您通過WooCommerce商店發(fā)送測試訂單和付款，以確保一切正常。為此，您首先需要在您的網(wǎng)站上安裝WooCommerce Payments插件 （如果您尚未安裝）：
WooCommerce支付插件
安裝并激活插件后，您可以啟用“Test Mode”。為此，請導(dǎo)航到WooCommerce > Payments > Settings：
WooCommerce支付測試模式
請記住保存您的更改。
啟用測試模式后，您可以瀏覽您的WooCommerce商店并選擇任何產(chǎn)品。將其添加到您的購物車，然后轉(zhuǎn)到結(jié)帳頁面。
根據(jù)需要填寫結(jié)帳頁面表單字段。對于付款信息，您可以使用WooCommerce提供的任何虛擬信用卡號。您也可以使用任何三位數(shù)字作為CVC代碼，并選擇任何未來日期。
完成后，單擊“Place Order”。接下來，導(dǎo)航到Payments > Transactions屏幕：
在WooCommerce中測試交易
在這里，您應(yīng)該會看到費用顯示。如果它在那里，您就知道您的結(jié)帳頁面正在正常工作。完成后記得關(guān)閉測試模式！
最好的WooCommerce Checkout插件和擴展
在這篇文章中，我們介紹了多種更改WooCommerce結(jié)帳頁面的方法，包括塊、短代碼和自定義代碼。我們還提到了一些關(guān)鍵插件，它們可以幫助您添加原本無法使用的特性和功能。
但是，我們還沒有提到一些額外的附加組件、插件和擴展，但它們?yōu)槟腤ooCommerce結(jié)帳頁面提供了更多自定義選項。一些值得考慮的最好的包括：
- WooCommerce Cart Notices Add-On。這個WooCommerce插件可讓您在結(jié)算過程中向客戶顯示可操作的消息和通知。例如，您可以使用它來通知他們相關(guān)的銷售和促銷活動。
- WooCommerce Checkout Manager。由為WooCommerce開發(fā)Direct Checkout的同一團隊制作，這個插件是一個強大的擴展，您可以使用它來優(yōu)化您的結(jié)帳頁面。您可以使用它來編輯、刪除和添加自定義字段，以及創(chuàng)建條件字段。
- WooCommerce Checkout Add-Ons。此高級插件可讓您在結(jié)帳階段添加免費和付費附加組件。它是提高轉(zhuǎn)化率和增加收入的有用工具。
根據(jù)您擁有的電子商務(wù)網(wǎng)站的類型，您可能正在尋找更多選擇。如果是這樣，我們建議查看WooCommerce擴展庫，它提供了大量用于擴展WooCommerce插件的特性和功能的附加組件，包括免費和付費解決方案。
小結(jié)
您可以采用不同的方法來改進和優(yōu)化您的WooCommerce結(jié)帳頁面。
根據(jù)您想要進行的更改和您的經(jīng)驗水平，您可以利用WooCommerce插件和擴展、頁面模板和主題，甚至自定義代碼。
網(wǎng)頁標題：WooCommerce結(jié)算頁面的完整指南
路徑分享：http://fisionsoft.com.cn/article/djcoeop.html
