WooCommerce: aggiungere campi personalizzati con facilità

Guida all’aggiunta di campi personalizzati tramite codice e plugin WordPress

Aggiungere campi in WooCommerce permette al sito web di raccogliere informazioni aggiuntive dai clienti, migliorando l’esperienza di acquisto e la gestione degli ordini.

Questa guida esplorerà come aggiungere campi personalizzati nelle diverse aree di WooCommerce: al checkout, nell’account utente e nel form di registrazione.

Aggiungere campi al checkout di WooCommerce

E’ possibile aggiungere campi al check out di WooCommerce utilizzando il filtro woocommerce_checkout_fields o un plugin dedicato. Ecco qui sotto un esempio di codice php per aggiungere un campo personalizzato:

add_filter( 'woocommerce_checkout_fields' , 'custom_checkout_field' );

function custom_checkout_field( $fields ) {
    $fields['billing']['custom_field'] = array(
        'label'     => __('Campo Personalizzato', 'woocommerce'),
        'placeholder'   => _x('Inserisci il dato', 'placeholder', 'woocommerce'),
        'required'  => true,
        'clear'     => false,
        'type'      => 'text',
        'priority'  => 22,
    );
    return $fields;
}

Aggiungere campi in account WooCommerce

Per aggiungere campi personalizzati alla pagina dell’account utente, si può sfruttare il filtro woocommerce_edit_account_form. Ecco come potresti fare:

add_action( 'woocommerce_edit_account_form', 'custom_user_profile_fields' );

function custom_user_profile_fields() {
    ?>
    <p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">
    <label for="custom_field"><?php _e('Campo Personalizzato', 'woocommerce'); ?>&nbsp;<span class="required">*</span></label>
    <input type="text" class="woocommerce-Input woocommerce-Input--text input-text" name="custom_field" id="custom_field" value="">
    </p>
    <?php
}

Aggiungere campi al form di registrazione di WooCommerce

L’aggiunta di campi al form di registrazione richiede l’uso del filtro woocommerce_register_form. Di seguito un esempio di come modificare il file aggiungendo un campo:

add_action( 'woocommerce_register_form', 'add_custom_registration_fields' );

function add_custom_registration_fields() {
    ?>
    <p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">
        <label for="reg_custom_field"><?php _e('Campo Personalizzato', 'woocommerce'); ?><span class="required">*</span></label>
        <input type="text" class="woocommerce-Input woocommerce-Input--text input-text" name="custom_field" id="reg_custom_field" value="<?php if ( ! empty( $_POST['custom_field'] ) ) echo esc_attr( $_POST['custom_field'] ); ?>" />
    </p>
    <?php
}

Salvare i dati dei campi personalizzati

Indipendentemente dalla posizione dei campi personalizzati, è fondamentale salvare i dati inseriti dagli utenti.

Questo può essere fatto tramite l’hook woocommerce_checkout_update_order_meta per i campi di checkout, woocommerce_save_account_details per i campi dell’account utente e woocommerce_created_customer per i campi di registrazione.

add_action( 'woocommerce_checkout_update_order_meta', 'save_custom_checkout_field' );

function save_custom_checkout_field( $order_id ) {
    if ( ! empty( $_POST['custom_field'] ) ) {
        update_post_meta( $order_id, 'Custom Field', sanitize_text_field( $_POST['custom_field'] ) );
    }
}

L’implementazione di campi personalizzati in WooCommerce può significativamente arricchire la raccolta dati e migliorare la gestione degli ordini, portando a una maggiore soddisfazione del cliente e una migliore efficienza operativa. Utilizza il codice adeguatamente e testa sempre le modifiche in un ambiente di staging prima di applicarle al tuo sito live.

Aggiungere campi personalizzati con plugin

Aggiungere campi personalizzati in WooCommerce può essere gestito anche attraverso l’uso di plugin, che offrono una soluzione più accessibile per utenti meno esperti di codice o per chi cerca una via più rapida e intuitiva. I plugin permettono di estendere le funzionalità di WooCommerce senza dover scrivere codice personalizzato. Di seguito, esploreremo come utilizzare i plugin per aggiungere campi personalizzati in diverse aree di WooCommerce.

1. Aggiungere Campi al Checkout con Plugin

WooCommerce Checkout Field Editor è uno dei plugin più popolari per personalizzare i campi della pagina di checkout. Con il plugin checkout field editor , puoi aggiungere, eliminare o modificare campi nella pagina di checkout. Ecco come utilizzarlo:

• Installare il plugin e attivarlo da WordPress Plugin Directory.
• Vai a WooCommerce > Impostazioni > Checkout Fields.
• Qui, puoi aggiungere nuovi campi utilizzando l’interfaccia del plugin. Scegli il tipo di campo, inserisci etichette e decidi se il campo è obbligatorio.
• Salva le modifiche per applicarle.

2. Aggiungere Campi all’Account Utente con Plugin

WooCommerce Edit Account Page permette di personalizzare facilmente la pagina dell’account utente aggiungendo campi personalizzati. Dopo aver installato e attivato il plugin:

• Accedi alla configurazione del plugin tramite il menu di WooCommerce.
• Segui le istruzioni per aggiungere nuovi campi alla pagina del profilo utente.
• Configura le impostazioni per ciascun campo, come obbligatorio o facoltativo, e salva.

3. Aggiungere Campi al Form di Registrazione con Plugin

Per aggiungere campi personalizzati al form di registrazione, puoi utilizzare Profile Builder – User Profile & User Registration Forms. Questo plugin non è specifico per WooCommerce ma è pienamente compatibile e offre la flessibilità per aggiungere campi al form di registrazione di WooCommerce:

• Dopo aver installato e attivato il plugin, vai a Profile Builder > Form Fields.
• Qui, puoi aggiungere campi personalizzati che appariranno nel form di registrazione.
• Configura ogni campo secondo le tue necessità e salva le modifiche.

Salvare e Gestire i Dati dei Campi Personalizzati

La maggior parte dei plugin per campi personalizzati in WooCommerce salverà automaticamente i dati inseriti dagli utenti nei campi personalizzati, senza bisogno di codice o componenti aggiuntivi. Inoltre, offrono opzioni per visualizzare e gestire questi dati nel backend di WordPress, facilitando la gestione degli ordini e dei profili utente.

Conclusioni

L’utilizzo di plugin per aggiungere campi personalizzati in WooCommerce è una soluzione pratica e accessibile che può semplificare notevolmente il processo di personalizzazione del tuo e-commerce. Che tu voglia raccogliere informazioni aggiuntive durante il checkout, migliorare i profili utente o personalizzare il form di registrazione, esiste un plugin che può soddisfare le tue esigenze. Ricorda sempre di testare ogni nuova funzionalità in un ambiente di staging prima di applicarla al tuo sito live per garantire la migliore esperienza possibile ai tuoi clienti.