九一九色国产,中国女人做爰A片,67194在线接播放

這是有關(guān)結(jié)賬字段和排序自定義字段系列的第一篇教程。我們從WooCommerce結(jié)賬表單定制開始。

就像WordPress一樣，WooCommerce有許多出色的動(dòng)作和過濾鉤子。使用這些鉤子的時(shí)候，您只需要修改唯一的文件-當(dāng)前主題的 functions.php這樣就足夠了（當(dāng)然，如果是子主題的functions.php就更好了）。

我們今天將要使用的主要過濾鉤子是woocommerce_checkout_fields。

但是，如果您正在尋找如何跳過購物車并為WooCommerce商店實(shí)施單頁結(jié)賬，那么此插件應(yīng)該會(huì)對(duì)您有所幫助。實(shí)際上，它允許您在商店中創(chuàng)建自定義結(jié)賬頁面。

文章目錄

woocommerce_checkout_fields簡(jiǎn)介

如果您只是因?yàn)橐獎(jiǎng)h除一些不必要的結(jié)賬字段或想禁用郵政編碼驗(yàn)證，則可以安全地跳過此步驟。但是，如果您想了解整個(gè)過程，那么您來對(duì)地方了。

好的，首先打開WooCoommerce商店結(jié)賬頁面。在我網(wǎng)站這里，看起來是這樣的。

這是我的測(cè)試網(wǎng)站上結(jié)帳頁面的界面截圖。店面主題處于活動(dòng)狀態(tài)。
現(xiàn)在，我們將嘗試管理結(jié)帳字段。

順便說一句，如果您正在尋找一種方法來更改“下訂單”按鈕的文本，那么我推薦本教程。

add_filter( 'woocommerce_order_button_html', 'misha_custom_button_html' );
 
function misha_custom_button_html( $button_html ) {
	$button_html = str_replace( 'Place order', 'Submit', $button_html );
	return $button_html;
}

插入這段代碼后，您將看到帶有參數(shù)而不是結(jié)賬表單的所有結(jié)賬字段的數(shù)組。這些字段按組進(jìn)行排序：billing，shipping，account，order。

一個(gè)特定的字段數(shù)組如下所示：

[billing_company] => Array
(
	[label] => Company name
	[class] => Array
	(
		[0] => form-row-wide
	)
	[autocomplete] => organization
  	[priority] => 30
)

禁用郵編、電話和省份驗(yàn)證

以下是驗(yàn)證。

是的，在本文中，我們將主要使用woocommerce_checkout_fields，但是有時(shí)候，當(dāng)您在結(jié)賬中同時(shí)包含計(jì)費(fèi)和發(fā)貨字段時(shí)，最好使用 woocommerce_default_address_fields動(dòng)作掛鉤（在單獨(dú)的教程中進(jìn)行介紹），因?yàn)樗鼤?huì)同時(shí)影響以下位置的發(fā)貨和計(jì)費(fèi)字段。

因此，使用它禁用郵編和省份驗(yàn)證會(huì)更容易一些。

add_filter( 'woocommerce_default_address_fields' , 'misha_disable_address_fields_validation' );
 
function misha_disable_address_fields_validation( $address_fields_array ) {
 
	unset( $address_fields_array['state']['validate']);
	unset( $address_fields_array['postcode']['validate']);
	// 你還可以禁用其他字段，比如 first_name and last_name, company, country, city, address_1 and address_2
 
	return $address_fields_array;
 
}

好吧，但是電話字段又該如何禁用呢？它不包含在地址字段數(shù)組中。我們將使用woocommerce_checkout_fields禁用電話驗(yàn)證。

add_filter( 'woocommerce_checkout_fields', 'misha_no_phone_validation' );
 
function misha_no_phone_validation( $woo_checkout_fields_array ) {
	unset( $woo_checkout_fields_array['billing']['billing_phone']['validate'] );
	return $woo_checkout_fields_array;
}

您可以在本教程中閱讀有關(guān)WooCommerce 結(jié)賬驗(yàn)證的更多信息。

刪除結(jié)賬字段

有一天，我的客戶要求我刪除所有結(jié)賬字段，但姓名、郵件和電話除外，因?yàn)樗Ｍ蛻粼趤磙k公室接收購買的產(chǎn)品時(shí)以現(xiàn)金付款。

我認(rèn)為這很明顯，但是請(qǐng)不要在CSS中隱藏結(jié)賬字段。

刪除字段是本教程中最簡(jiǎn)單的步驟之一。這是如何做到的：

add_filter( 'woocommerce_checkout_fields', 'misha_remove_fields', 9999 );
 
function misha_remove_fields( $woo_checkout_fields_array ) {
 
	// 她希望在結(jié)賬頁面保留下面的字段
	// unset( $woo_checkout_fields_array['billing']['billing_first_name'] );
	// unset( $woo_checkout_fields_array['billing']['billing_last_name'] );
	// unset( $woo_checkout_fields_array['billing']['billing_phone'] );
	// unset( $woo_checkout_fields_array['billing']['billing_email'] );
	// unset( $woo_checkout_fields_array['order']['order_comments'] ); // remove order notes
 
	// 然后刪除下面的字段
	unset( $woo_checkout_fields_array['billing']['billing_company'] ); // remove company field
	unset( $woo_checkout_fields_array['billing']['billing_country'] );
	unset( $woo_checkout_fields_array['billing']['billing_address_1'] );
	unset( $woo_checkout_fields_array['billing']['billing_address_2'] );
	unset( $woo_checkout_fields_array['billing']['billing_city'] );
	unset( $woo_checkout_fields_array['billing']['billing_state'] ); // remove state field
	unset( $woo_checkout_fields_array['billing']['billing_postcode'] ); // remove zip code field
 
	return $woo_checkout_fields_array;
}

我將鉤子的優(yōu)先級(jí)設(shè)置為9999，因?yàn)槲蚁氡M可能晚地運(yùn)行它。當(dāng)然，如果您刪除結(jié)賬帳單的詳細(xì)信息，則不希望使用信用卡卡付款。當(dāng)然不會(huì)。但是，如果您想使用PayPal Standard，一切都應(yīng)該沒問題。

添加上述代碼后，我的結(jié)賬界面如下所示。

如果您網(wǎng)站需要在線付款，特別是通過信用卡付款，請(qǐng)小心刪除字段。

如果要禁用條款和協(xié)議復(fù)選框，實(shí)際上不需要任何代碼，只需轉(zhuǎn)到WooCommerce設(shè)置并將其關(guān)閉即可。我們將在下文介紹。

設(shè)置字段為可選或必填

好吧，讓我們繼續(xù)講同樣的故事–我的客戶問我：“ Misha，請(qǐng)讓電話和電子郵件字段全寬顯示，在電話前放置電子郵件字段，然后讓姓氏和電話字段變?yōu)榉潜靥睢薄?/em>

我們先來設(shè)置字段是否必填。所需要做的就是更改字段數(shù)組中的唯一參數(shù)，現(xiàn)在就開始吧：

add_filter( 'woocommerce_checkout_fields' , 'misha_not_required_fields', 9999 ); function misha_not_required_fields( $f ) { unset( $f['billing']['billing_last_name']['required'] ); // 這就是重點(diǎn) unset( $f['billing']['billing_phone']['required'] ); // 可以使用類似的方式將字段設(shè)置為必填 // $f['billing']['billing_company']['required'] = true; return $f; }

更改字段排序

正如上文提到的，客戶要求我將郵箱地址放在電話字段的前面，由于知識(shí)點(diǎn)有點(diǎn)多，我單獨(dú)寫了一篇教程介紹這個(gè)。

按照教程去操作以后，我們可以看到結(jié)賬界面變成了這個(gè)樣子：

好吧，這不是我所期望的。

為什么會(huì)這樣呢？由于僅對(duì)字段數(shù)組進(jìn)行排序還不夠，因此您還必須將適當(dāng)?shù)腸ss類應(yīng)用于每個(gè)字段。

實(shí)際上，每個(gè)結(jié)賬字段都有自己的樣式（CSS類），具體取決于其位置，共有3個(gè)主要類：

form-row-first –半寬，位于前面
form-row-last –半寬，位于后面
form-row-wide – 全寬

現(xiàn)在，我們將使用以下代碼將電話和電子郵件字段變?yōu)槿珜挕?/p>
add_filter( 'woocommerce_checkout_fields' , 'misha_checkout_fields_styling', 9999 ); function misha_checkout_fields_styling( $f ) { $f['billing']['billing_email']['class'][0] = 'form-row-wide'; $f['billing']['billing_phone']['class'][0] = 'form-row-wide'; return $f; }

最后效果如下：

更改標(biāo)簽和占位符

以下是用來更改賬單字段的標(biāo)簽和賬單備注字段的占位符的代碼。

add_filter( 'woocommerce_checkout_fields' , 'misha_labels_placeholders', 9999 ); function misha_labels_placeholders( $f ) { // first name can be changed with woocommerce_default_address_fields as well $f['billing']['billing_first_name']['label'] = 'Your mom calls you'; $f['order']['order_comments']['placeholder'] = 'What\'s on your mind?'; return $f; }

結(jié)果如下：

條款和協(xié)議復(fù)選框

在繼續(xù)下一步并開始在代碼中創(chuàng)建此復(fù)選框之前，我想向您展示一種非常簡(jiǎn)單且正確的方法。

首先，在“頁面”>“新建頁面 ”中創(chuàng)建“條款和協(xié)議”頁面。

然后，轉(zhuǎn)到WooCommerce>設(shè)置>高級(jí)，在此處設(shè)置頁面。

WooCommerce>設(shè)置>高級(jí)>頁面設(shè)置

就是這樣，在此處選擇頁面并保存更改后，該復(fù)選框?qū)⒊霈F(xiàn)在結(jié)賬頁面上的 “下訂單”按鈕之前。

添加自定義結(jié)賬字段

在文章的這一部分中，我將在WooCommerce結(jié)賬表單中添加兩個(gè)字段：賬單明細(xì)下方的下拉選擇框和“訂購”部分的“訂閱”復(fù)選框。第一個(gè)字段將是必填字段。

下面我們?cè)敿?xì)來說下如何實(shí)現(xiàn)。

首先，我們應(yīng)該決定要在哪里放置新字段。以下是可選位置：

woocommerce_before_checkout_billing_form
woocommerce_after_checkout_billing_form
woocommerce_before_checkout_registration_form
woocommerce_after_checkout_registration_form
woocommerce_before_checkout_shipping_form
woocommerce_after_checkout_shipping_form
woocommerce_before_order_notes
woocommerce_after_order_notes

從位置名稱可以一目了然-它也是動(dòng)作掛鉤的名稱，我們將在下面使用。此處還以與模板代碼中相同的順序提到了字段位置。

這些位置可能僅在一種情況下不適合您-如果WooCommerce默認(rèn)結(jié)賬模板：form-shipping.php并且form-billing.php在主題中被覆蓋。在這種情況下，您可以手動(dòng)將新字段添加到主題文件/woocommerce/checkout目錄中。

// 添加字段 add_action( 'woocommerce_after_checkout_billing_form', 'misha_select_field' ); add_action( 'woocommerce_after_order_notes', 'misha_subscribe_checkbox' ); // 保存字段 add_action( 'woocommerce_checkout_update_order_meta', 'misha_save_what_we_added' ); // 選擇 function misha_select_field( $checkout ){ // 你可以添加一些自定義html內(nèi)容在這里 woocommerce_form_field( 'contactmethod', array( 'type' => 'select', // text, textarea, select, radio, checkbox, password, about custom validation a little later 'required' => true, // actually this parameter just adds "*" to the field 'class' => array('misha-field', 'form-row-wide'), // array only, read more about classes and styling in the previous step 'label' => 'Preferred contact method', 'label_class' => 'misha-label', // sometimes you need to customize labels, both string and arrays are supported 'options' => array( // options for <select> or <input type="radio" /> '' => 'Please select', // empty values means that field is not selected 'By phone' => 'By phone', // 'value'=>'Name' 'By email' => 'By email' ) ), $checkout->get_value( 'contactmethod' ) ); // 你可以添加一些自定義html內(nèi)容在這里 } // 復(fù)選框 function misha_subscribe_checkbox( $checkout ) { woocommerce_form_field( 'subscribed', array( 'type' => 'checkbox', 'class' => array('misha-field form-row-wide'), 'label' => ' Subscribe to our newsletter.', ), $checkout->get_value( 'subscribed' ) ); } // 保存字段的值 function misha_save_what_we_added( $order_id ){ if( !empty( $_POST['contactmethod'] ) ) update_post_meta( $order_id, 'contactmethod', sanitize_text_field( $_POST['contactmethod'] ) ); if( !empty( $_POST['subscribed'] ) && $_POST['subscribed'] == 1 ) update_post_meta( $order_id, 'subscribed', 1 ); }

結(jié)果：

將上面的代碼插入到functions.php或自定義插件中后，新字段將顯示在結(jié)帳頁面上。

提交訂單后，您將看到結(jié)賬字段值出現(xiàn)在新訂單“自定義字段”元數(shù)據(jù)框中：

如果在編輯訂單頁面上找不到此框，請(qǐng)?jiān)凇捌聊贿x項(xiàng)”選項(xiàng)卡中將其打開，您可以在屏幕的右上角找到它。

但是，如何對(duì)新的結(jié)賬字段進(jìn)行驗(yàn)證呢？woocommerce_form_field() 的required參數(shù)僅在字段標(biāo)簽附近添加一個(gè)符號(hào)* ，但不處理驗(yàn)證。

設(shè)置必填字段/自定義驗(yàn)證/創(chuàng)建自定義錯(cuò)誤通知

如果未選擇首選的聯(lián)系方式，此小段代碼將打印通知。如前所述，對(duì)于自定義結(jié)賬字段而言，僅設(shè)置required參數(shù)為true，還不足以讓它變成必填字段，因?yàn)槿鄙衮?yàn)證。

add_action('woocommerce_checkout_process', 'misha_check_if_selected'); function misha_check_if_selected() { // 你可以在這里添加自定義驗(yàn)證 if ( empty( $_POST['contactmethod'] ) ) wc_add_notice( 'Please select your preferred contact method.', 'error' ); }

看一下wp_add_notice函數(shù)的第二個(gè)參數(shù)-它也支持“success”和“notice”通知類型，但是“error”是唯一與此相關(guān)的參數(shù)。

哈哈，好吧，我應(yīng)該在這里添加更多有趣的事情：將自定義結(jié)賬字段集成到：查看訂單頁面，感謝頁面，編輯訂單頁面（wp-admin），電子郵件…，但是我在一篇文章中講這么多，那是多么長(zhǎng)篇大論了。因此，我決定繼續(xù)在單獨(dú)的文章繼續(xù)探討，歡迎繼續(xù)關(guān)注我們網(wǎng)站的更新。

聲明：原文出自 https://rudrastyh.com/woocommerce/checkout-fields.html ，由WordPress大學(xué)翻譯整理，轉(zhuǎn)載請(qǐng)保留本聲明！

聲明：本站所有文章，如無特殊說明或標(biāo)注，均為本站原創(chuàng)發(fā)布。任何個(gè)人或組織，在未征得本站同意時(shí)，禁止復(fù)制、盜用、采集、發(fā)布本站內(nèi)容到任何網(wǎng)站、書籍等各類媒體平臺(tái)。如若本站內(nèi)容侵犯了原著者的合法權(quán)益，可聯(lián)系我們進(jìn)行處理。