←Volver al Blog

Qué es el filtro woocommerce_checkout_fields y casos de uso – WooCommerce

2023-03-12•3 min de lectura

woocommerce_checkout_fields es un hook de acción en WooCommerce que se utiliza para mostrar y modificar los campos del proceso de pago en la página de pago. Cuando este hook se activa, genera una matriz de campos de pago que se utilizan para construir el formulario de pago.

Esta matriz incluye varios campos, como detalles de facturación, detalles de envío y notas del pedido, y cada campo está representado por una matriz de propiedades. Estas propiedades incluyen la etiqueta del campo, el tipo, el marcador de posición, el valor predeterminado, el estado de requerido y más.

Por defecto, los campos del proceso de pago se muestran en un orden específico en la página de pago. Sin embargo, puedes modificar el orden de los campos, sus propiedades y su apariencia utilizando varios filtros que están asociados a este hook.

Por ejemplo, puedes usar el hook woocommerce_checkout_fields para modificar el orden de los campos, ocultar campos específicos, añadir nuevos campos o cambiar las propiedades de los campos existentes. También puedes añadir validación personalizada a los campos del proceso de pago utilizando este hook.

Casos de uso del hook woocommerce_checkout_fields

Para cambiar el orden de los campos del proceso de pago

La propiedad priority determina el orden en que se muestran los campos. Cuanto mayor sea el valor de prioridad, más abajo aparecerá el campo en la página de pago.

/**
 * Cambiar el orden de los campos del proceso de pago
 */
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 );

En el fragmento de código anterior, al campo billing_phone se le da un valor de prioridad de 15 y al campo billing_email se le da un valor de prioridad de 25. Esto significa que el campo del teléfono aparecerá antes que el campo del correo electrónico en la página de pago.

Para cambiar las propiedades de los campos del proceso de pago

/**
 * Establecer una clase y el atributo de solo lectura a los campos del proceso de pago
 */
function filter_reorder_checkout_fields( $checkout_fields ) {
    // Obtener el objeto del usuario actual.
    $current_user = wp_get_current_user();
    // Si el usuario actual ha iniciado sesión, forzar que el correo electrónico sea el correo electrónico del usuario actual
    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 );

El fragmento de código anterior comprueba si el usuario actual ha iniciado sesión comprobando la propiedad ID del objeto del usuario actual. Si el usuario ha iniciado sesión, el código añade una clase CSS llamada hidden-field al campo billing_email bajo la clave billing de la matriz $checkout_fields. Esta clase podría usarse para ocultar el campo de correo electrónico en la página de pago para que el correo electrónico del usuario no pueda ser modificado durante el proceso de pago.

Además, el código añade una propiedad custom_attributes al campo billing_email con un atributo readonly establecido en true. Esto hace que el campo de correo electrónico sea de solo lectura para que el usuario no pueda modificar su correo electrónico, incluso si logra mostrar el campo.

Categorías:

WooCommerce