Imaginemos que quieres agregar un campo de pago personalizado (y no un Campo adicional de facturación o envío) en la página de pago de WooCommerce. Por ejemplo, podría ser un número de licencia del cliente: esto no tiene nada que ver con la facturación y nada que ver con el envío.
Idealmente, este campo personalizado podría mostrar por encima de las notas del pedido de la página de pago, justo después del formulario de envío. Contará con una etiqueta, un campo de entrada y será necesario.
Entonces, así es como lo haces, ¡espero que te ayude a entender que cualquier cosa es posible con WooCommerce!
Php Snippet (Parte 1 de 3): agregue el nuevo campo @ WooCommerce.
Aquí mostramos el nuevo campo en la página de pago de WooCommerce, y específicamente por encima de las «Notas de pedido», que generalmente se muestra al final del formulario de envío.
La nueva identificación de campo es «licencia_no“, Que será útil para recordar en las partes 2 y 3.
/** n*@snippet Add Custom Field @ WooCommerce Checkout Page n*@how-to https://tdestudiodesign.com/tutoriales n*@author Tomás Lucas D´Amario, TD Estudio Design n*@testedwith WooCommerce 6 n*@community https://tdestudiodesign.com/club */ add_action( 'woocommerce_before_order_notes', 'tddesign_add_custom_checkout_field' ); function tddesign_add_custom_checkout_field( $checkout ) { $current_user = wp_get_current_user(); $saved_license_no = $current_user->license_no; woocommerce_form_field( 'license_no', array( 'type' => 'text', 'class' => array( 'form-row-wide' ), 'label' => 'License Number', 'placeholder' => 'CA12345678', 'required' => true, 'default' => $saved_license_no, ), $checkout->get_value( 'license_no' ) ); }
Php Snippet (Parte 2 de 3): Validar el nuevo campo de pago
Ahora, una vez que se procesa el pago, queremos asegurarnos de que nuestro campo no esté vacío. Recuerda, elegimos «Requerido» => verdadero lo que significa que el campo tendrá una marca requerida junto a su etiqueta. Sin embargo, esto no es suficiente: todavía necesitamos generar un mensaje de error si nuestro campo está vacío.
/** n*@snippet Validate Custom Field @ WooCommerce Checkout Page n*@how-to https://tdestudiodesign.com/tutoriales n*@author Tomás Lucas D´Amario, TD Estudio Design n*@testedwith WooCommerce 6 n*@community https://tdestudiodesign.com/club */add_action( 'woocommerce_checkout_process', 'tddesign_validate_new_checkout_field' ); function tddesign_validate_new_checkout_field() { if ( ! $_POST['license_no'] ) { wc_add_notice( 'Please enter your Licence Number', 'error' ); }}
Php Snippet (Parte 3 de 3): Guardar y mostrar nuevo campo @ WooCommerce Página de agradecimiento, página de pedidos y correos electrónicos
Si se pasa la validación, WooCommerce procesa la orden. Pero el nuevo valor de campo se pierde, ya que no hay ninguna función que «almacene» ese valor en los llamados «meta datos de orden». Necesitamos guardar y también mostrar el valor de campo dentro de los pedidos y los correos electrónicos de pedido.
/** n*@snippet Save & Display Custom Field @ WooCommerce Order n*@how-to https://tdestudiodesign.com/tutoriales n*@author Tomás Lucas D´Amario, TD Estudio Design n*@testedwith WooCommerce 6 n*@community https://tdestudiodesign.com/club */add_action( 'woocommerce_checkout_update_order_meta', 'tddesign_save_new_checkout_field' ); function tddesign_save_new_checkout_field( $order_id ) { if ( $_POST['license_no'] ) update_post_meta( $order_id, '_license_no', esc_attr( $_POST['license_no'] ) );}add_action( 'woocommerce_thankyou', 'tddesign_show_new_checkout_field_thankyou' ); function tddesign_show_new_checkout_field_thankyou( $order_id ) { if ( get_post_meta( $order_id, '_license_no', true ) ) echo '<p><strong>License Number:</strong> ' . get_post_meta( $order_id, '_license_no', true ) . '</p>';} add_action( 'woocommerce_admin_order_data_after_billing_address', 'tddesign_show_new_checkout_field_order' ); function tddesign_show_new_checkout_field_order( $order ) { $order_id = $order->get_id(); if ( get_post_meta( $order_id, '_license_no', true ) ) echo '<p><strong>License Number:</strong> ' . get_post_meta( $order_id, '_license_no', true ) . '</p>';}add_action( 'woocommerce_email_after_order_table', 'tddesign_show_new_checkout_field_emails', 20, 4 ); function tddesign_show_new_checkout_field_emails( $order, $sent_to_admin, $plain_text, $email ) { if ( get_post_meta( $order->get_id(), '_license_no', true ) ) echo '<p><strong>License Number:</strong> ' . get_post_meta( $order->get_id(), '_license_no', true ) . '</p>';}
Este código todavía funciona, a menos que informe lo contrario. Para excluir los conflictos, cambie temporalmente al tema de la tienda, deshabilite todos los complementos, excepto WooCommerce, y pruebe el fragmento nuevamente: Solución de problemas de WooCommerce 101