woocommerce

Come aggiungere campi personalizzati e customizzare il checkout di WooCommerce

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

Oppure rimuovere dei campi in questo modo

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 :

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

Qui invece mostro il campo nell’ordine a back end

Ed infine lo inserisco nella mail dell’ordine

Per far apparire un errore nel caso in cui il campo Codice Fiscale non venga compilato, scriverò questo codice

come aggiungere il codice fiscale a woocommerceParte dell’articolo è stato liberamente tradotto da https://docs.woocommerce.com/document/tutorial-customising-checkout-fields-using-actions-and-filters/

Programmatore WordPress e Joomla, PHP/MySQL.
Sono freelance mi trovi come Professionista Joomla e articolista nella lista ufficiale di joomla.it, e come Professionista WordPress nella lista ufficiale di WUG Italia.
Dal 2006 sono titolare di Web Synapse, una Web Agency di Milano.
Pratico Kung Fu Wing Chun e mi piacciono le tagliatelle al ragù ! :-)

Commenta l'articolo

Bisogno di postare codice ? Usa un servizio gratuito come Codeshare altrimenti WordPress formatta male il codice!

Pin It on Pinterest

Condividi l'articolo. Grazie.

Vuoi essere aggiornato ?