Als je een e-mail wilt sturen naar de klanten die jouw product besteld hebben dan is het wel fijn als dit e-mailadres ook klopt. De bezoekers hebben dit e-mailadres zelf ingevoerd in de webshop maar het gebeurt regelmatig dat hier typefouten in zitten waardoor mails niet aankomen. Wat kun je hier aan doen?

Bevestig het e-mailadres in WooCommerce checkout

Hoe voorkom je dit en hoe bevestigt een klant zelf het e-mailadres in een WooCommerce webshop? Er zijn verschillende WordPress plugins te vinden die een extra veld toevoegen waarin het e-mailadres veld gevalideerd wordt.

In principe heb je hier geen extra WordPress plugin voor nodig en is een simpel stukje code voldoende. Hiervan zijn er diverse te vinden op het internet. Bijvoorbeeld deze code van Businessbloomer die je in bijvoorbeeld in de functions.php van je thema kunt plaatsen.


/**
* @snippet       Add "Confirm Email Address" Field @ WooCommerce Checkout
* @how-to        Get CustomizeWoo.com FREE
* @author        Rodolfo Melogli
* @testedwith    WooCommerce 7
* @community     https://businessbloomer.com/club/
*/
  
// ---------------------------------
// 1) Make original email field half width
// 2) Add new confirm email field
  
add_filter( 'woocommerce_checkout_fields' , 'bbloomer_add_email_verification_field_checkout' );
   
function bbloomer_add_email_verification_field_checkout( $fields ) {
    $fields['billing']['billing_email']['class'] = array( 'form-row-first' );
    $fields['billing']['billing_em_ver'] = array(
       'label' => 'Confirm mail Address',
       'required' => true,
       'class' => array( 'form-row-last' ),
       'clear' => true,
       'priority' => 999,
    );
    return $fields;
}
  
// ---------------------------------
// 3) Generate error message if field values are different
  
add_action( 'woocommerce_checkout_process', 'bbloomer_matching_email_addresses' );
  
function bbloomer_matching_email_addresses() { 
    $email1 = $_POST['billing_email'];
    $email2 = $_POST['billing_em_ver'];
    if ( $email2 !== $email1 ) {
        wc_add_notice( 'Your email addresses do not match', 'error' );
    }
}

Het resultaat ziet er dan zo uit.
Email validatie wooCommerce

Geen hoofd of kleine letters

Zorg dat het validatieveld geen rekening houdt met hoofdletters en kleine letters. Een e-mailadres werkt namelijk altijd, onafhankelijk van hoofdletters en kleine letters.

Als een bezoeker de automatische invulfunctie van de browser gebruikt is de kans groot dat het e-mailadres met een hoofdletter geschreven wordt.

Mocht deze bezoeker in het validatieveld dan een kleine letter gebruiken, dan zal de validatie niet kloppen als hier niet naar gekeken wordt in het script. En dit betekent weer e-mails van klanten die niet kunnen bestellen.

Feedback

Heb je na het lezen van dit artikel nog vragen of zijn er onduidelijkheden? Werkt de code niet op jouw website? Laat het ons weten, dan kunnen wij je misschien verder helpen.

Feedback kennisbankartikel

Naam
Dit veld is bedoeld voor validatiedoeleinden en moet niet worden gewijzigd.

Mis geen WordPress tips meer.

Al 500+ webdesigners en marketeers ontvangen deze nieuwsbrief.

Naam
Dit veld is bedoeld voor validatiedoeleinden en moet niet worden gewijzigd.

Mis nooit meer website tips.

Al 500+ webdesigners en marketeers ontvangen onze nieuwsbrief.

Naam
Dit veld is bedoeld voor validatiedoeleinden en moet niet worden gewijzigd.