WooCommerce修改賬單和收貨地址字段

WooCommerce有4個不同的過濾器掛鉤,可以管理地址字段,讓我們弄清楚何時以及如何使用它們。

在創建教程之前,我嘗試過使用Google進行搜索,并在WooCommerce中找到了關于計費和運送字段的太多奇怪信息。現在讓我們對此有所了解!

WooCommerce中有兩種類型的字段-計費和運送字段。在這兩個類別中都顯示了某些字段,例如名字字段或國家/地區字段。

現在仔細閱讀:

  • 我們可以使用 woocommerce_default_address_fields?鉤子在字段中進行更改-在這種情況下,更改將影響所有內容-修改“我的賬戶”中的賬單和運送字段頁面以及結賬頁面。
  • woocommerce_shipping_fields?–相同,但僅影響運送字段
  • woocommerce_billing_fields?–相同,但僅影響計費字段
  • woocommerce_checkout_fields–僅影響界面頁面,沒有其他影響,此鉤子已在單獨的教程中詳細介紹。

刪除默認的計費和運送字段

一個簡單的示例如下:

add_filter( 'woocommerce_default_address_fields', 'misha_remove_fields' );
 
function misha_remove_fields( $fields ) {
 
	unset( $fields[ 'address_2' ] );
	return $fields;
 
}

字段ID為:

  • first_name
  • last_name
  • company
  • address_1
  • address_2
  • state
  • city
  • country
  • postcode

請注意,如果您使用的是woocommerce_shipping_fields?或woocommerce_billing_fields?過濾器掛鉤,則必須在字段ID中添加適當的前綴(billing_shipping_),例如:

add_filter( 'woocommerce_billing_fields', 'misha_remove_billing_fields' );
 
function misha_remove_billing_fields( $fields ) {
 
	unset( $fields[ 'billing_address_2' ] ); // or shipping_address_2 for woocommerce_shipping_fields hook
	return $fields;
 
}

禁用字段驗證

在這種情況下,您不必刪除整個字段本身,而只需刪除它的某個屬性(required)。

使運送姓氏字段為可選的示例:

add_filter( 'woocommerce_shipping_fields', 'misha_remove_fields' );
 
function misha_remove_fields( $fields ) {
 
	unset( $fields[ 'shipping_last_name' ]['required'] );
	return $fields;
 
}

結果如下所示:

如果要將“姓氏”字段設置為“賬單”和“運送”字段組都是可選的,也可以使用 woocommerce_default_address_fields

另一方面,如果您想將字段設置為必填,只需在上面代碼的第5行將required屬性設置為true,如下所示:

$fields[ 'shipping_company' ]['required'] = true;

如何更改默認地址字段?

在前面的示例中,我已經說明了如何使任何默認字段為可選或必需。但這required不是我們可以更改的唯一字段參數。以下是其他參數:

  • label?(字符串)
  • placeholder?(字符串)
  • class?(數組)
  • priority?(整數)

這些參數均可以更改。作為示例,讓我們嘗試在“賬單”和“運送”的“姓氏”字段中進行更改:

add_filter( 'woocommerce_default_address_fields' , 'misha_change_fname_field' );
 
function misha_change_fname_field( $fields ) {
 
	$fields['first_name']['label'] = 'Name';
	$fields['first_name']['placeholder'] = 'Your mom calls you';
 
	return $fields;
 
}

結果如下:

您可以在我的有關WooCommerce?結帳字段的教程中找到更多示例。是的,我們在woocommerce_checkout_fields那里使用動作掛鉤,但這非常相似。

創建自定義地址字段

創建地址字段比為“編輯帳戶”頁面或“結賬”頁面創建字段容易得多。

您甚至不必使用woocommerce_form_field()函數!

真的,這就是關于數組的全部工作:

add_filter( 'woocommerce_default_address_fields', 'misha_add_field' );
 
function misha_add_field( $fields ) {
 
	$fields['fav_color']   = array(
		'label'        => 'Favorite color',
		'required'     => true,
		'class'        => array( 'form-row-wide', 'my-custom-class' ),
		'priority'     => 20,
		'placeholder'  => 'Is it black or orange or maybe green?',
	);
 
	return $fields;
 
}

請記住以下幾點:

如果要使用woocommerce_shipping_fields或使用woocommerce_billing_fields鉤子,請不要忘記在上面代碼的第5行添加字段前綴shipping_billing_。我認為即使此處沒有前綴也可以解決問題,但是添加前綴可以更加保險和精準。

$fields['billing_fav_color'] = array(

您可能會猜想,這也是如何將字段存儲在wp_usermeta表的數據庫中的元鍵。

關于CSS類的幾句話:

  • form-row-wide?–全寬列,
  • form-row-first?– 2列字段,第一列,
  • form-row-last?– 2列字段,第二列;

您可以自己使用 priority參數,例如,我設置了20,將我的字段放在“名”和“姓”字段下:

很酷的是,它將在WooCommerce結賬頁面上顯示并且也將完全起作用!

如何將字段添加到WP后臺個人資料編輯頁面?

好的,我們的字段現在顯示在“我的賬戶”中的“編輯地址”頁面和“結賬”頁面中。但是WordPres后臺呢?如果該字段也出現在“編輯個人資料”頁面中,那就太好了,您不這樣認為嗎?這是我的意思:

好消息是,你不必使用show_user_profileedit_user_profile掛鉤!

有一個特殊的鉤子:

add_filter( 'woocommerce_customer_meta_fields', 'misha_admin_address_field' );
 
function misha_admin_address_field( $admin_fields ) {
 
	$admin_fields['billing']['fields']['billing_fav_color'] = array(
		'label' => 'Fav color',
		'description' => 'Some field description will go here',
	);
 
	// or $admin_fields['shipping']['fields']['shipping_fav_color']
	// or both
 
	return $admin_fields;
 
}

在這里我們需要兩個參數-?labeldescription即可。只要確保該字段名稱(第5行)匹配即可。

如果您也想在WordPress后臺編輯訂單頁面上添加字段,請閱讀此處的方法。

聲明:原文出自 https://rudrastyh.com/woocommerce/billing-and-shipping-address-fields.html ,由WordPress大學翻譯整理,轉載請保留該聲明!

倡萌

一個文科IT宅男,喜歡折騰WordPress和被它折騰 ^_^

暫無評論

發表評論