Come vengono caricati i campi del checkout in WooCommerce ?
I campi della sezione billing (fatturazione) e shipping (spedizione) sono dichiarati all’interno della classe (class-wc-countries.php) e nella funzione get_address_fields . Ciò permette a WooCommerce di abilitare o disabilitare i campi basandosi sulla geolocalizzazione dell’utente.
Prima di renderizzare i campi, WooCommerce passa i vari campi all’interno di un filtro in modo tale che siano modificabili da plugin di terze parti, dal tema in uso e dal codice PHP personalizzato.
Come fare un override dei campi di checkout di WooCommerce
Per esempio potremmo modificare la label e il placeholder del box “Note sull’ordine” in questo modo
|
1 2 3 4 5 6 7 8 9 |
// 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'; $fields['order']['order_comments']['label'] = 'My new label'; return $fields; } |
Oppure rimuovere dei campi in questo modo
|
1 2 3 4 5 6 7 8 9 |
// 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; } |
Nella tabella lascio una lista dei campi passati attraverso l’array woocommerce_checkout_fields
| Billing (Fatturazione) | Shipping (Spedizione) | Account | Ordini |
| billing_first_name | shipping_first_name | account_username | order_comments |
| billing_last_name | shipping_last_name | account_password | |
| billing_company | shipping_company | account_password-2 | |
| billing_address_1 | shipping_address_1 | ||
| billing_address_2 | shipping_address_2 | ||
| billing_city | shipping_city | ||
| billing_postcode | shipping_postcode | ||
| billing_country | shipping_country | ||
| billing_state | shipping_state | ||
| billing_email | |||
| billing_phone |
Ogni campo contiene le seguenti opzioni presenti in un array
- type – tipo di campo (text, textarea, password, select)
- label – la label per i campi input
- placeholder – placeholder per i campi input
- class – classe CSS per i campi input
- required – true o false, definisce se il campo è obbligatorio oppure no
- clear – true o false, applica il clear ai campi o alle label
- label_class – classe CSS per le label
- options – per i campi select, inserire le opzioni in un array (key => valore)
Come rendere facoltativo un campo di WooCommerce al checkout
Se volessimo invece sovrascrivere i valori di default di un campo, per esempio per renderlo facoltativo, dovremmo utilizzare la lista dei campi contenuti in woocommerce_default_address_fields , ossia :
- country
- first_name
- last_name
- company
- address_1
- address_2
- city
- state
- postcode
Quindi per rendere il campo address_1 facoltativo, scriveremo :
|
1 2 3 4 5 6 7 8 9 |
// Hook in add_filter( 'woocommerce_default_address_fields' , 'custom_override_default_address_fields' ); // Our hooked in function - $address_fields is passed via the filter! function custom_override_default_address_fields( $address_fields ) { $address_fields['address_1']['required'] = false; return $address_fields; } |
Come aggiungere un nuovo campo nel checkout di WooCommerce
La cosa che mi chiedono più spesso è quella di inserire il campo Codice Fiscale e renderlo obbligatorio, non chè stamparlo anche nella mail dell’ordine e nella gestione ordine a back end.
Per fare ciò utilizzo un filtro
Qui aggiungo il campo Codice Fiscale e lo aggiungo all’ordine
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
add_filter( 'woocommerce_checkout_fields' , 'codice_fiscale' ); function codice_fiscale( $fields ) { $fields['billing']['codice_fiscale'] = array( 'label' => __('Codice Fiscale', 'woocommerce'), 'placeholder' => _x('Codice Fiscale', 'placeholder', 'woocommerce'), 'required' => true, 'class' => array('form-row-last'), 'clear' => true ); return $fields; } add_action( 'woocommerce_checkout_update_order_meta', 'codice_fiscale_order_meta' ); function codice_fiscale_order_meta( $order_id ) { if ( ! empty( $_POST['codice_fiscale'] ) ) { update_post_meta( $order_id, 'Codice Fiscale', sanitize_text_field( $_POST['codice_fiscale'] ) ); } } |
Qui invece mostro il campo nell’ordine a back end
|
1 2 3 4 5 |
add_action( 'woocommerce_admin_order_data_after_billing_address', 'codice_fiscale_order_meta_admin', 10, 1 ); function codice_fiscale_order_meta_admin($order){ echo '<p><strong>'.__('Codice Fiscale').':</strong> ' . get_post_meta( $order->id, 'Codice Fiscale', true ) . '</p>'; } |
Ed infine lo inserisco nella mail dell’ordine
|
1 2 3 4 5 6 |
add_filter('woocommerce_email_order_meta_keys', 'my_custom_fiscale_order_meta_keys'); function my_custom_fiscale_order_meta_keys( $keys ) { $keys[] = 'Codice Fiscale'; return $keys; } |
Per far apparire un errore nel caso in cui il campo Codice Fiscale non venga compilato, scriverò questo codice
|
1 2 3 4 5 6 7 |
add_action('woocommerce_checkout_process', 'required_cf_checkout_field_process'); function required_cf_checkout_field_process() { // Check if set, if its not set add an error. if ( ! $_POST['codice_fiscale'] ) wc_add_notice( __( 'Compila il campo Codice Fiscale .' ), 'error' ); } |
Parte dell’articolo è stato liberamente tradotto da https://docs.woocommerce.com/document/tutorial-customising-checkout-fields-using-actions-and-filters/
Programmatore WordPress Esperto WooCommerce
Sono l’autore di questo blog con tanti trucchi e guide su WordPress e WooCommerce.
Ciao, ho installato il plugin però non riesco a disattivare i campi obbligatori, come posso fare? Utilizzo Woocommerce. Grazie
Ciao, volevo chiederti come si procede per cambiare la sequenza dei campi? esempio mettere prima il last_name e poi il first_name.
Grazie in anticipo
Ciao Alessio, io vorrei aggiungere il campo obbligatorio con la data di nascita del cliente, come posso fare? Grazie
Salve,
un bellissimo, interessante e utile articolo complimenti.
Ho apportato alcune modifiche alla pagina checkout grazie ai tuoi suggerimenti.
Mi resta solamente un aspetto da definire e sarebbe quello di limitare l’area di vendita al un solo CAP ed impossibilitare altre zone alla possibilità di acquisto.
E’ possibile fare qualcosa del genere?
Ti ringrazio anticipatamente per la tua disponibilità
Cordiali saluti
Denise
ciao! Grazie per condividere questi trucchi con tutti 😉 potresti dirmi invece come fare per mettere il codice fiscale obbligatorio solo per chi compra dall’italia?
Ciao Alessio ho inserito : // 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;
}
per rimuovere il campo box informazioni aggiuntive però è rimasta la scritta informazioni aggiuntive come la tolgo? grazie mille
Grazie Alessio davvero ottimo professionista
Ciao Alessio,
grazie per i trucchi suggeriti, li trovo molto interessati.
Volevo chiederti, ho impostato la richiesta di “ricevuta” e “fattura” ma vorrei far visualizzare dei campi solo a seconda della scelta dell’utente, secondo te è possibile?
Grazie!
Buona sera. Vorrei inserire un campo numero “(A)” sul pagina del prodotto che compilerà il cliente. Una volta effettuato l’acquisto vorrei che il cliente ricevesse una email con un numero generato da un calcolo tipo numero (A) + 10 X 3 . Grazie in anticipo.
Ciao,
è possibile creare un campo per fare caricare all’utente un documento ?
Grazie per la risposta
Ciao Alessio, articolo interessante. Quindi se voglio inserire il campo codice fiscale/P.Iva basta inserire
add_filter ecc… nel file .php che trovo nella directory plugin/woocommerce/includes/class-wc-countries.php.
Il campo viene automaticamente aggiunto, oppure devo modificare anche in functions.php o altre parti?
Grazie
Ciao Alessio,
è possibile inserire un campo già prevalorizzato?
O meglio, per un determinato prodotto, sto cercando di modificare il campo note
$fields[‘order’][‘order_comments’]
Come posso dargli un valore già predefinito che non sia il placeholder?
Ciao Alessio,
è pobbile mostrare i campi solo se, mi spiego:
sarebbe ideale avere un menù a tendina con:
Privato – Ricevuta
I campi che ci sono sono sufficienti (senza codice fiscale)
Privato – Fattura
Inserire e rendere obbligatorio il campo Codice fiscale e inserire PEC non obbligatorio
Azienda – Fattura
Inserire e rendere obbligatori:
P.IVA
PEC
SDI
inserire, personalizzare o togliere, sono riuscto a farlo tramite i tuoi codici qui sopra, ma metterli con un IF… non so farlo,
grazie anticipatamente,
La migliore guida in assoluto. Grazie Alessio
Ciao Alessio
ecco il mio problema sto cercando di modificare i campi del check out di woocommerce usando il plugin “Checkout Field Editor and Manager for WooCommerce” che è molto semplice il problema è che quando faccio le modifiche esse non hanno effetto non cambia nulla…
Leggendo quà è la mi sembra di capire che il problema risieda nel mio tema istallato che non permette le modifiche
Che ne pensi?
Grazie Valerio
Grazie Alessio per i tuoi pronti e preziosi consigli
Valerio