Retour au blog

Qu'est-ce que le filtre woocommerce_checkout_fields et ses cas d'utilisation – WooCommerce

2023-03-123 min de lecture

woocommerce_checkout_fields est un hook d'action dans WooCommerce qui est utilisé pour afficher et modifier les champs de paiement sur la page de paiement. Lorsque ce hook est déclenché, il génère un tableau de champs de paiement qui sont utilisés pour construire le formulaire de paiement.

Ce tableau comprend divers champs, tels que les détails de facturation, les détails d'expédition et les notes de commande, et chaque champ est représenté par un tableau de propriétés. Ces propriétés incluent le libellé du champ, son type, son espace réservé, sa valeur par défaut, son statut obligatoire, et plus encore.

Par défaut, les champs de paiement sont affichés dans un ordre spécifique sur la page de paiement. Cependant, vous pouvez modifier l'ordre des champs, leurs propriétés et leur apparence à l'aide de divers filtres attachés à ce hook.

Par exemple, vous pouvez utiliser le hook woocommerce_checkout_fields pour modifier l'ordre des champs, masquer des champs spécifiques, ajouter de nouveaux champs ou modifier les propriétés des champs existants. Vous pouvez également ajouter une validation personnalisée aux champs de paiement à l'aide de ce hook.

Cas d'utilisation du hook woocommerce_checkout_fields

Pour changer l'ordre des champs de paiement

La propriété priority détermine l'ordre dans lequel les champs sont affichés. Plus la valeur de priorité est élevée, plus le champ apparaît bas sur la page de paiement.

/**
 * Changer l'ordre des champs de paiement
 */
function filter_reorder_checkout_fields( $checkout_fields ) {
    $checkout_fields['billing']['billing_phone']['priority'] = 15;
    $checkout_fields['billing']['billing_email']['priority'] = 25;

    return $checkout_fields;
}
add_filter( 'woocommerce_checkout_fields', 'filter_reorder_checkout_fields', 100 );

Dans l'extrait de code ci-dessus, le champ billing_phone reçoit une valeur de priorité de 15 et le champ billing_email reçoit une valeur de priorité de 25. Cela signifie que le champ téléphone apparaîtra avant le champ e-mail sur la page de paiement.

Pour changer les propriétés des champs de paiement

/**
 * Définir une classe et l'attribut readonly pour les champs de paiement
 */
function filter_reorder_checkout_fields( $checkout_fields ) {
    // Obtenir l'objet utilisateur actuel.
    $current_user = wp_get_current_user();
    // Si l'utilisateur actuel est connecté, forcer l'e-mail à être l'e-mail de l'utilisateur actuel
    if ( $current_user->ID ) {
        $checkout_fields['billing']['billing_email']['class'][] = 'hidden-field';
        $checkout_fields['billing']['billing_email']['custom_attributes']   = [ 'readonly' => true ];
    }

    return $checkout_fields;
}
add_filter( 'woocommerce_checkout_fields', 'filter_reorder_checkout_fields', 100 );

L'extrait de code ci-dessus vérifie si l'utilisateur actuel est connecté en vérifiant la propriété ID de l'objet utilisateur actuel. Si l'utilisateur est connecté, le code ajoute une classe CSS appelée hidden-field au champ billing_email sous la clé billing du tableau $checkout_fields. Cette classe pourrait être utilisée pour masquer le champ e-mail sur la page de paiement afin que l'e-mail de l'utilisateur ne puisse pas être modifié pendant le paiement.

De plus, le code ajoute une propriété custom_attributes au champ billing_email avec un attribut readonly défini sur true. Cela rend le champ e-mail en lecture seule afin que l'utilisateur ne puisse pas modifier son e-mail même s'il parvient à afficher le champ.

Catégories: