Pré-remplir un formulaire de commande avec le courriel entré par un visiteur sur la landing page

Cela faisait presque 2 jours que je m’arrachais les cheveux là dessus en me disant qu’il devait bien y avoir un moyen, voici la situation : j’ai créé une landing page en y intégrant le widget Formulaire d’Elementor (Pro), je souhaitais qu’après avoir entré son adresse mél, le visiteur soit redigé vers la page de commande WooCommerce où là, l’adresse mél qu’il avait déjà renseigné précédemment soit reportée dans le formulaire de commande WooCommerce.

Réglages du widget Formulaire d’Elementor (Pro)

Champs du formulaire et Bouton envoyer

• Glisser/déposer le widget
• Sélectionner les champs nécessaires
• Personnaliser l’aspect (j’aime bien les formulaires « inline », l’astuce est de préciser 50% pour la taille du champ du courriel et la taille du bouton)
• Personnaliser le texte du bouton et le texte indicatif du champ
• Dans la tabulation AVANCÉ du champ E-mail attribuer un ID unique (par précaution)

Actions après envoi

• Choisir Redirection dans les options
• Coller l’url suivante :

https://MonSupersite.com/checkout/?email=[field id="MonEmailID"]

• Remplacer « MonSupersite.com » par l’url de votre site et « MonEmailID » par l’ID de votre E-mail (attention à garder les guillemets, si vous prenez le code court comme il est, ça ne marchera pas)

Ajouter le snippet au fichier functions.php

Dernière ligne droite pour que tout fonctionne correctement, il y a un morceau de code à rajouter au fichier functions.php de votre thème enfant. C’est celui-là :

/**
 * @snippet       Pré-remplir un formulaire de commande
 * @sourcecode    https://ludovicclain.com/?p=182
 * @compatible    Testé et fonctionnel avec WooCommerce 5.3.2, Elementor Pro - 2.9.2, WooCommerce - 4.0.1    
 */
add_filter('woocommerce_checkout_fields', 'prefill_billing_fields');

function prefill_billing_fields($address_fields) {


    // Get the data from the URL

    if (isset($_GET['fname']) || isset($_GET['lname']) || isset($_GET['email'])) {

        // wp_die();

        $fname = isset($_GET['fname']) ? esc_attr($_GET['fname']) : '';
        $lname = isset($_GET['lname']) ? esc_attr($_GET['lname']) : '';
        $em = isset($_GET['email']) ? esc_attr($_GET['email']) : '';

        // First Name

        if (isset($_GET['fname']) && !empty($_GET['fname'])) {
            if (isset($address_fields['billing']['billing_first_name'])) {
                $address_fields['billing']['billing_first_name']['default'] = $fname;
            }
        }

        // Last Name

        if (isset($_GET['lname']) && !empty($_GET['lname'])) {
            if (isset($address_fields['billing']['billing_last_name'])) {
                $address_fields['billing']['billing_last_name']['default'] = $lname;
            }
        }

        // Email

        if (isset($_GET['email']) && !empty($_GET['email'])) {
            if (isset($address_fields['billing']['billing_email'])) {
                $address_fields['billing']['billing_email']['default'] = $em;
            }
        }
    }

    return $address_fields;
}

Bonus

Avec le code ci-dessus, lors de votre prochaine campagne d’email marketing, vous pourrez faire en sorte que lorsque votre prospect clique sur le lien de commande présent dans votre courriel, son formulaire de commande soit déjà pré-rempli avec ses coordonnées et ainsi éliminer une friction supplémentaire à l’achat.

Références

• https://www.cantwaittillmonday.com/prefill-checkout-fields-cartflows/