Editar campos en el checkout de woocommerce

Aquí vas a aprender a editar los campos del checkout de Woocommerce. Estos campos aparecen durante el último paso que por defecto nos configura Woocommerce. El proceso sería el siguiente:

1.- Añadimos al carrito el producto o servicio pulsando el botón de “Añadir al carrito”

2.- Justo después de añadirlo, y si no hemos configurado nuestra tienda para que nos rediriga a la página del carrito, aparecerá un aviso de confirmación que nos comunica que ya se ha añadido el producto. Hacemos click en el botón de “Ver carrito”.

3.- Llegaremos la página de resumen del pedido, donde aparece la información del coste total del producto, los artículos añadidos a la cesta, etc. En esta sección ya vamos a finalizar nuestra compra, y de esta manera, llegaremos a lo que nos interesa: El checkout.

4.- Ya hemos llegado donde queríamos, la página de compra. Aquí por defecto vamos a encontrar un montón de campos por rellenar, y es posible que no sean necesarios todos estos campos. A continuación vemos todos los campos que aparecen por defecto:

De momento, woocommerce no permite seleccionar fácilmente los campos que queremos pedir, pero no te preocupes ya que con tan sólo unas pequeñas líneas de código podremos eliminar los que no creamos necesarios.

Código para personalizar los campos del checkout en Woocommerce

Bien, para eliminar estos campos tendremos que añadir el siguiente código al final de nuestro archivo function.php de la plantilla que tenemos activa.

<?php
 
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
 
function custom_override_checkout_fields( $fields ) {
    unset($fields['billing']['billing_first_name']);
    unset($fields['billing']['billing_last_name']);
    unset($fields['billing']['billing_company']);
    unset($fields['billing']['billing_address_1']);
    unset($fields['billing']['billing_address_2']);
    unset($fields['billing']['billing_city']);
    unset($fields['billing']['billing_postcode']);
    unset($fields['billing']['billing_country']);
    unset($fields['billing']['billing_state']);
    unset($fields['billing']['billing_phone']);
    unset($fields['order']['order_comments']);
    return $fields;
}

Bien, vamos a ir viéndolo uno a uno.

Eliminar del formulario de compra de woocommerce el campo: Nombre de la empresa

Como decía, para hacerlo debemos añadir el siguiente código en el function.php de nuestro tema hijo.

<?php
 
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
 
function custom_override_checkout_fields( $fields ) {

  unset($fields['billing']['billing_company']);
  return $fields;

}

Eliminar del formulario de woocommerce el campo: Dirección y código postal

Añadiremos el siguiente código:

<?php
 
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
 
function custom_override_checkout_fields( $fields ) {

    unset($fields['billing']['billing_address_1']);
    unset($fields['billing']['billing_address_2']);
    unset($fields['billing']['billing_postcode']);

    return $fields;

}

Eliminar el campo de apellidos del formulario de woocommerce

Añadiremos el siguiente código:

<?php
 
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
 
function custom_override_checkout_fields( $fields ) {

  unset($fields['billing']['billing_last_name']);
  
  return $fields;

}

Eliminar el campo de comentarios en el proceso de compra de woocommerce

Añadiremos el siguiente código:

<?php
 
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
 
function custom_override_checkout_fields( $fields ) {

unset($fields['order']['order_comments']);  

return $fields;

}

Estos son los principales campos que suelen eliminarse del proceso de compra en woocommerce, no obstante, podrás eliminar cualquier campo de los que aparece en el primer bloque de código que he compartido aquí.

Luego sólo debes personalizar ese código con las líneas que afectan a los campos que deseas quitar.

Muy importante, recuerda antes de realizar ningún cambio hacer una copia de seguridad de todo, así si algo sale mal podrás restaurarlo y dejarlo como estaba.

Por defecto el código que comparto contigo lo que hace es utilizar los hooks de Woocommerce para decirle que no haga algo (poner determinados campos de formulario). Cada línea de código que comienza por “unset”, elimina el campo que se describe en esa misma línea (en inglés).

Asi que, si sólo quieres eliminar un campo, elimina el resto de líneas de código y deja sólo la del campo que quieres eliminar.

En cualquier caso, si quieres ahorrarte tiempo en hacer todo esto, puedes contactar conmigo aquí y te lo hago yo.

¡Hasta pronto!