如何向 WooCommerce 商店添加註冊表單

已發表: 2021-08-18

這一次,我們將採用最簡單的方法來向 WooCommerce 商店和購物平台添加註冊表單

用戶友好的註冊表單是任何類型的網站都應具備的重要部分之一。 無論您擁有酒店或旅行社、服務提供還是商業網站。

您需要向您的潛在客戶和潛在客戶提供註冊表,以便將他們的個人數據和其他詳細信息輸入到註冊字段中,並提交給您以獲取服務、產品、訂閱、計劃或更多信息。

什麼是註冊表?
註冊表單是一系列需要填寫用戶信息的字段。

總體而言,這是從對您的業務、商店、公司、非營利組織或其他任何事物感興趣的網絡用戶、客戶、客戶和追隨者那裡收集所需信息的理想方式。

要將註冊表單添加到 WooCommerce 商店時應考慮的事項
好吧,註冊幾十個網站和博客對於互聯網用戶來說並不是最愉快的過程。

但事實是,他們已經習慣了,並準備在大多數情況下為您提供他們的基本信息。

但是,您需要通過解釋為什麼網絡訪問者應該註冊到您的網站來確保您的註冊表單具有真正的價值。

避免要求太多信息,只留下邏輯字段,解釋你為什麼,使隱私和安全政策精確且易於理解。

為什麼優化商業網站的註冊表很重要
註冊表單的可用性和簡單性直接決定了您數據庫中的用戶數量,並影響用戶繼續與您的網站建立關係的願望。

因此,格式良好且操作良好的聯繫表可能會帶來更多的客戶和更多的商機。

此外,如果您設法向 WooCommerce 商店添加一個簡單、易於理解且功能完美的註冊表單,它將使您免於收到大量需要技術支持的信件,這將不可避免地讓您和您的員工感到頭疼。

現在,當我們展示了將註冊表單集成到您的在線 WooCommerce 環境中的重要性時,讓我們從技術角度了解如何完成它。

如何向 WooCommerce 商店添加註冊表單
首先,您需要從 WooCommerce 後端設置中啟用表單。 按照路徑 WooCommerce、設置、帳戶、啟用註冊。 您將被帶到需要選中“在“我的帳戶”頁面上啟用客戶註冊”旁邊的框的窗口。

在這裡您還可以控制其他設置,例如在結帳頁面上顯示回頭客登錄提醒,自動生成用戶名或客戶密碼等,以使註冊過程更加用戶優化。

完成此設置部分後,註冊表單將顯示在前端,這意味著您為 WooCommerce 添加註冊表單的努力沒有白費。

正如您現在所看到的,您添加的表單非常簡單和謙虛。 因此,下一步是在您已啟用的註冊表單中添加字段。

如果要添加一些基本字段,例如名字和姓氏、電話號碼、電子郵件和密碼,可以在 functions.php 文件的末尾插入以下代碼。

函數 wooc_extra_register_fields() {?>

<p class="form-row form-row-wide">

<label for=”reg_billing_phone”><?php _e('Phone', 'woocommerce'); ?></標籤>

<input type=”text” class=”input-text” name=”billing_phone” id=”reg_billing_phone” value=”<?php esc_attr_e( $_POST['billing_phone'] ); ?>” />

</p>

<p class="form-row form-row-first">

<label for=”reg_billing_first_name”><?php _e('First name', 'woocommerce'); ?><span class=”required”>*</span></label>

<input type=”text” class=”input-text” name=”billing_first_name” id=”reg_billing_first_name” value=”<?php if ( !empty( $_POST['billing_first_name'] ) ) esc_attr_e( $_POST[' billing_first_name'] ); ?>” />

</p>

<p class=”form-row form-row-last”>

<label for=”reg_billing_last_name”><?php _e( '姓氏', 'woocommerce' ); ?><span class=”required”>*</span></label>

<input type=”text” class=”input-text” name=”billing_last_name” id=”reg_billing_last_name” value=”<?php if ( !empty( $_POST['billing_last_name'] ) ) esc_attr_e( $_POST[' billing_last_name'] ); ?>” />

</p>

<div class=”clear”></div>

<?php

}

add_action('woocommerce_register_form_start', 'wooc_extra_register_fields');

刷新頁面後,您會發現註冊表中添加了新字段。

每當您想將您的註冊表單與帳單地址聯繫起來時,您需要在字段名稱前添加前綴“帳單”。 您可以在下面找到最常用的表單字段:

billing_first_name, billing_last_name, billing_company, billing_address_1, billing_address_2,

billing_city, billing_postcode, billing_country, billing_state, billing_email, billing_phone

現在是時候使用要添加到functions.php 文件的另一段代碼來驗證表單字段中的數據了。 使用下面提到的代碼行進行數據驗證:

/**

*註冊字段驗證。

*/

功能 wooc_validate_extra_register_fields( $username, $email, $validation_errors ) {

if ( isset( $_POST['billing_first_name'] ) && empty( $_POST['billing_first_name'] ) ) {

$validation_errors->add( 'billing_first_name_error', __( '<strong>錯誤</strong>: First name is required!', 'woocommerce' ) );

}

if ( isset( $_POST['billing_last_name'] ) && empty( $_POST['billing_last_name'] ) ) {

$validation_errors->add( 'billing_last_name_error', __( '<strong>錯誤</strong>: 需要姓氏!.', 'woocommerce' ) );

}

返回 $validation_errors;

}

add_action('woocommerce_register_post', 'wooc_validate_extra_register_fields', 10, 3);

此代碼檢查 $_POST 數組中的表單值,並在值不存在或數據無效時包含錯誤消息。

最後,您需要將這些值保存在數據庫中。 驗證值後,您需要在 functions.php 中使用以下代碼將值插入數據庫:

/**

* 下面的代碼保存額外的字段。

*/

功能 wooc_save_extra_register_fields( $customer_id ) {

if ( isset( $_POST['billing_phone'] ) ) {

// 在 WooCommerce 中使用的電話輸入字段

update_user_meta( $customer_id, 'billing_phone', sanitize_text_field( $_POST['billing_phone'] ) );

}

if ( isset( $_POST['billing_first_name'] ) ) {

//默認的名字字段

update_user_meta( $customer_id, 'first_name', sanitize_text_field( $_POST['billing_first_name'] ) );

// WooCommerce 中使用的名字字段

update_user_meta( $customer_id, 'billing_first_name', sanitize_text_field( $_POST['billing_first_name'] ) );

}

if ( isset( $_POST['billing_last_name'] ) ) {

// 默認的姓氏字段

update_user_meta( $customer_id, 'last_name', sanitize_text_field( $_POST['billing_last_name'] ) );

// WooCommerce 中使用的姓氏字段

update_user_meta( $customer_id, 'billing_last_name', sanitize_text_field( $_POST['billing_last_name'] ) );

}

}

add_action('woocommerce_created_customer', 'wooc_save_extra_register_fields');

完成的! 現在,您已經成功地收集、驗證和添加了數據庫中的值,並且可以使用它們了。

相關文章:BigCommerce 與 WooCommerce 之間的比較——哪個更好?

如您所見,您可以快速向 WooCommerce 商店添加註冊表單,向其中添加字段並確保您的用戶對您的工作感到滿意。

作為企業主,儘早設置網站非常重要,在此過程中,請確保將其設置在 WordPress 平台上,因為它為您提供了比大多數網站更大的靈活性。

確保您選擇了與 woocommerce 兼容的主題,並為 woocommerce 商店設置了註冊表。

這個過程相當簡單,最多只需要幾分鐘。 如果您想知道為什麼要費心費力地為 woocommerce 商店設置註冊表單,那麼您可能需要查看下面列出的原因。

  • 用戶信息:通過使用您網站上的註冊表單,您可以讓用戶訂閱每日更新,並確保他們收到有關您的產品和服務的最新信息。 您可以使用他們與您共享的信息來優化您的營銷,以便您可以比以前更有效地接觸您的關鍵人群。
  • 用戶參與度:通過使用註冊表單,您實際上是在與用戶進行交互。 隨著用戶參與度的增加,轉化和實際銷售的機會增加,這就是為什麼您應該確保您的 woo 商務帶有在後台啟用的註冊表單的原因。
  • 營銷:用戶提供的任何信息都應證明是無價的。 您可以使用此信息直接向他們推銷您的產品和服務,但請確保您沒有發送垃圾郵件,因為這是嚴格禁止的。

    更重要的是,您可以簡化營銷策略,使用客戶提供的信息並針對他們投放特定廣告。

  • 輕鬆設置:設置註冊表的過程相當簡單; 您需要做的就是前往 woocommerce 管理區域並從後端啟用註冊表單並激活它。 您甚至可以對其進行自定義,以吸引新客戶,因此,他們有興趣通過您剛剛安裝在網站上的註冊表單為您提供所需的信息。
  • SEO:通過您網站上的註冊表單,您應該能夠為您的用戶提供增強的用戶體驗,這反過來應該有助於提高這些 SERP 排名。 這應該會帶來更多的流量,因此應該有助於增加頁面瀏覽量、印像等等。

這些是為什麼您應該儘早在您的網站上安裝註冊表單的一些原因。

更重要的是,您需要確保不會向您的用戶發送垃圾郵件,因為這是趕走新客戶和潛在潛在客戶的一種可靠方式。

您需要為他們提供折衷方案,即您可以為他們提供一些免費贈品、優惠或更多信息,以便在您的網站上註冊。

通過這樣做,您向他們提供了一些有價值的東西作為回報,這肯定會激發他們的興趣並促使他們在註冊表中輸入他們的信息。