personalizzare-i-campi-del-checkout-woocommerce

Come personalizzare i campi di registrazione in Woocommerce

24 novembre 2016
in Codice, Wordpress

SEOZoom

Hai installato Woocommerce nel sito WordPress negozio del tuo cliente.
Se hai un minimo di esperienza con i clienti che chiedono personalizzazioni ‘su misura’, ti sarai accorto che il core di Woocommerce non basta.
Nella mia piccola esperienza non sono affatto rare richieste del tipo:

“Mi puoi aggiungere un campo nella spedizione del checkout?”
“Mi puoi eliminare o disattivare quell’altro campo lì? “
“Mi cambi la dicitura di quell’etichetta, piuttosto che il nome di un campo?”

Diciamolo, è un classico dei clienti.

Se tu dovessi installare un plugin per ogni personalizzazione di Woocommerce che il cliente ti chiede, rischieresti di avere un pannello di amministrazione colmo di pulsanti e correresti il rischio che alcuni plugin fra di loro creino conflitti (es.: funzioni omonime, variabili omonime, ecc.).

Oggi ti propongo una soluzione che non ha bisogno di plugin, ma che è un codice semplice semplice da aggiungere al tuo file functions.php (se hai installato un tema child, ovviamente aggiungi questo codice file functions.php all’interno della cartella del tuo tema child).

Questo codice ti permette di:

  • Aggiungere
  • Eliminare
  • Modificare

i campi di fatturazione (billing) e spedizione (shipping) del checkout del tuo ecommerce. In pratica questi campi qui sotto (guarda anche l’immagine alla fine di questa lista):

  • Billing
    • 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
  • Shipping
    • shipping_first_name
    • shipping_last_name
    • shipping_company
    • shipping_address_1
    • shipping_address_2
    • shipping_city
    • shipping_postcode
    • shipping_country
    • shipping_state
  • Account
    • account_username
    • account_password
    • account_password-2
  • Order
    • order_comments

cambiare aggiornare i campi i woocommerce
In questo ambito, la documentazione ufficiale di Woocommerce ti può essere di molto aiuto.

 

 

Come puoi aggiungere un campo personalizzato nel checkout di Woocommerce

Ci vuole un esempio: poniamo che tu voglia aggiungere un campo “Codice Fiscale” e renderlo obbligatorio.

Aggiungi questo codice nel file functions.php:

// Creo un hook
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
function custom_override_checkout_fields( $fields ) {
// Aggiungo il campo codice fiscale e lo rendo obbligatorio
$fields['billing']['billing_codice_fiscale'] = array(
'label'     => __('Codice Fiscale', 'woocommerce'),
'placeholder'   => _x('Codice Fiscale', 'placeholder', 'woocommerce'),
'required'  => true,
'clear'     => true
);
return $fields;
}
// Mostro il nuovo campo codice fiscale nella pagina di checkout
function my_custom_checkout_field_display_admin_order_meta($order){
echo '<div><strong>'.__('Codice Fiscale').':</strong> ' . get_post_meta( $order->id, '_codice_fiscale', true ) . '</div >';
}

Come puoi rinominare /modificare un campo personalizzato nel checkout di Woocommerce

Ci vuole un esempio: poniamo che tu voglia rinominare il campo “Ragione Sociale” in “Nome Azienda” sia nel blocco di fatturazione che nel blocco di spedizione.

Il codice da inserire è il seguente:

$fields['billing']['billing_company]['label'] = 'Nome azienda';

Occhio chè questa riga di codice la devi inserire all’interno della funzione precedente.

Il risultato finale sarà questo:

// Creo un hook
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
function custom_override_checkout_fields( $fields ) {
// Aggiungo il campo codice fiscale e lo rendo obbligatorio
$fields['billing']['billing_codice_fiscale'] = array(
'label'     => __('Codice Fiscale', 'woocommerce'),
'placeholder'   => _x('Codice Fiscale', 'placeholder', 'woocommerce'),
'required'  => true,
'clear'     => true
);
// Rinomino  'Ragione sociale' in 'Nome Azienda'
$fields['billing']['billing_company']['label'] = 'Nome azienda';

return $fields;
}
// Mostro il nuovo campo codice fiscale nella pagina di checkout
function my_custom_checkout_field_display_admin_order_meta($order){
echo '<div><strong>'.__('Codice Fiscale').':</strong> ' . get_post_meta( $order->id, '_codice_fiscale', true ) . '</div >';
}

Come puoi eliminare un campo personalizzato nel checkout di Woocommerce

Anche in questo ti faccio un esempio: poniamo che vuoi eliminare il campo “Città” dalle informazioni di spedizione.

Il codice da inserire sarà:

unset($fields[shipping][' shipping_city’]);

Occhio chè questa riga di codice la devi inserire all’interno della funzione precedente.

Il risultato finale sarà questo:

// Creo un hook
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
function custom_override_checkout_fields( $fields ) {
// Aggiungo il campo codice fiscale e lo rendo obbligatorio
$fields['billing']['billing_codice_fiscale'] = array(
'label'     => __('Codice Fiscale', 'woocommerce'),
'placeholder'   => _x('Codice Fiscale', 'placeholder', 'woocommerce'),
'required'  => true,
'clear'     => true
);
// Rinomino  ‘Ragione sociale’ in 'Nome Azienda'
$fields['billing']['billing_company']['label'] = 'Nome azienda';
// Elimino il campo ‘Città’ dalle informazioni di spedizione
unset($fields[shipping][' shipping_city’]);

return $fields;
}

Ulteriori approfondimenti in inglese li trovi nella pagina ufficiale di Woocommerce che parla di questo argomento.

4,466 Visite totali, 3 visite odierne

Sommario Articolo
Come personalizzare i campi di registrazione in Woocommerce
Nome Articolo
Come personalizzare i campi di registrazione in Woocommerce
Descrizione
Vuoi aggiungere, modificare o eliminare campi in Woocommerce? Ti svelo subito come!
Autore dell'Articolo
Nome dell'Editore
Fausto Giungato - SEO e SEM
Logo dell'Editore
Scroll Up
Altro... Codice, Wordpress
Slideshow o carosello prodotti più venduti in Woocommerce? Ecco il plugin!

Usi Wocoomerce (lo so che lo usi :D) ed hai necessità di selezionare alcuni prodotti da mettere in evidenza o...

Chiudi