Woocommerce no incluye ninguna opción relacionada con la personalización o modificación de campos de registro o alta de cliente en la tienda.

En este post vamos a ver un plugin freemium (tiene una versión gratuita) que si nos va a permitir eliminar, personalizar, editar y añadir nuevos campos en el formulario de registro de Woocommerce que se muestra en el checkout o proceso de finalización de compra. Te recuerdo que un plugin Freemium, es aquel que tiene una versión gratuita más limitada y una versión de pago con más opciones

 

APÚNTATE A MI PLATAFORMA DE CURSOS. ACCEDE A TODOS LOS CURSOS POR SOLO 10 €/MES


VER CURSOS

 

 

 

 

 

1.- Opciones de personalización de campos que nos permite el plugin Woocommerce Checkout Field Editor

 

El plugin Woocommerce Checkout Field Editor, en su versión gratuita, nos va a permitir:

 

i.- Eliminar o desactivar campos: el plugin nos permite eliminar y desactivar campos existentes en el formulario de registro de Woocommerce, en el proceso de checkout.

ii.- Modificar campos: el plugin en su versión gratuita permite personalizar determinados aspectos de un campo existente en Woocommerce. Como, por ejemplo, hacer que sea o no  sea “requerido” (obligatorio de rellenar)

iii.- Añadir campos: podremos crear nuevos campos en el checkout de Woocommerce. En la versión gratuita podremos utilizar campos de texto y de tipo desplegable.

iv.- Resetear campos formulario: podemos volver al estado inicial o por defecto del formulario de registro de Woocommerce.

v.- Recoger nuevos campos: podremos elegir si queremos que los datos aportados por el cliente en los nuevos campos que hayamos creado se muestren en los datos de pedido e incluso emails.

 

Plugin Woocommerce checkout editor manager

IR AL PLUGIN

Si estás buscando cómo adaptar tu tienda Woocommerce a la RGPD, aquí tienes un post específico sobre el tema: RGPD Woocommerce

 

2.- Pantalla principal del plugin WooCommerce Checkout Field Editor

 

Una vez hayas instalado el plugin, podrás acceder a su pantalla de gestión desde: “WooCommerce > Checkout Form”.

La interface está dividida en 3 pestañas fundamentales:

 

i.- Billing Fields: en esta pestaña podremos personalizar, editar o añadir nuevos campos al formulario de Facturación en el checkout de Woocommerce. Es decir, lo que se conoce como la dirección de facturación del registro de Woocommerce o detalles de Facturación.

ii.- Shipping Fileds: en esta pestaña podremos editar o añadir nuevos campos al formulario de envío en el checkout de Woocommerce.  Es decir, podremos gestionar los campos del formulario de dirección de envío de Woocommerce (Nota: este formulario ya no aparece en el checkout en las últimas versiones de Woocommerce).

iii.- Additional Fields: con esta pestaña podremos personalizar los campos que aparecen en el formulario de registro como “Información Adicional”.

Por defecto, el único campo de información adicional que se incluye en Woocommerce es un área de texto dedicado a dar la posibilidad al cliente de añadir información adicional al pedido.

 

formulario dirección envio y facturación Woocommerce

Pestañas de selección de formulario a editar

 

 

2.1.- Formulario de dirección de facturación y de dirección de envío en Woocommerce

 

En anteriores versiones de Woocommerce era posible mostrar u ocultar el formulario para establecer la dirección de envío. Estas opciones estaban en: “Woocommerce > Ajustes > Envio > Opciones de envio” y luego en el apartado: “Destino de envio”.

  • Si marcábamos la opción: “Por defecto la dirección de envío del cliente”, se mostraban dos formularios en el registro de Woocommerce (Dirección de facturación y de envío).
  • Si marcábamos la opción: “Por defecto la dirección de facturación del cliente”, se mostraba solo el formulario para establecer la dirección de facturación.

 

En las últimas versiones de Woocommerce, ya solo aparece en el registro del checkout el formulario para establecer la dirección de facturación.

Una vez en el área de cliente (mi cuenta), ya si es posible establecer una dirección de envío diferente a la dirección de facturación. Pero los campos que añadamos o personalicemos no se verán aquí ya que el plugin sirve para personalizar los campos de registro del checkout o finalización de compra.

 

 

3.- Elementos de un campo de registro en Woocommerce con Checkout Field Editor

 

Los elementos o atributos de un campo de registro en Woocommerce nos van a dar una idea de las acciones que podremos realizar sobre los mismos:

  • i.- Name: identificador del campo (este texto no aparece en el formulario)
  • ii.- Type: tipo de campo. Campo de texto, área de texto, checkbox, radio button, etc.
  • iii.- Label: Nombre del campo (este nombre SI aparecerá en el formulario).
  • iv.- Placeholder: texto que aparecerá en el campo. Habitualmente es un texto de ejemplo que se pone en algunos campos de texto.
  • v.- Validation rules: regla de validación del campo. Es decir, si en el campo se incluye una regla de validación de email, no se permitirá introducir ningún contenido en el campo que no concuerde con la estructura de un correo electrónico.
  • vi.- Required: si el campo es obligatorio de rellenar para poder validar el formulario de Woocommerce.
  • vii.- Clear row: esta opción obliga a la plantilla que se esté utilizando a mostrar el campo en una sola fila. Es decir, no permite compartir la misma fila con otro campo.
  • viii.- Enlabled: activa o desactiva el campo (Enabled = Activado)
  • ix.- Edit: el botón de editar nos permitirá cambiar o editar algunas de las características o atributos de un campo.
  • x.- Display in Emails: el campo rellenado por el cliente se mostrará en emails.
  • xi.- Display in Order Detail Pages: el campo rellenado por el cliente se mostrará en los detalles del pedido en “Woocommerce > Pedidos”.

 

 

4.- Modificar campos de registro con Woocommerce en el checkout

 

Para editar un campo, tendrásprimero que seleccionar, en la parte superior, la pestaña correspondiente al campo que quieres editar: Billing Fields (dirección facturación), Shipping Fields (dirección envio) y Additional Fields (campos adicionales)

Es interesante que abras otra navegador y pongas la página de registro a través de checkout, para ir viendo los cambios que vayas haciendo.  Cuando hagas un cambio, simplemente haz clic en F5 para actualizar los cambios en el navegador donde estés visualizando los campos del registro en Woocommerce

 

En este post puedes ver como modificar campos de registro con Prestashop

 

A continuación, haz clic en el botón “Edit” correspondiente al campo que quieras editar y te aparecerá una ventana emergente. Realiza la modificación que quieras y haz clic en el botón “Edit Field”.

Si es un campo original de Woocommerce, habrá algunas características que no podrás modificar.

 

Editar campos registro woocommerce

Modificar campos registro Woocommerce

 

Los aspectos más interesantes a modificar de los campos existentes serán:

 

 

4.1.- Eliminar campo registro de Woocommerce en el Checkout

 

Para eliminar un campo, simplemente desmarca el checkbox de nombre “Enabled” y el checkbox: “Required”. A continuación, haz clic en el botón “Edit Field”.

A continuación, haz clic en «Save Changes»

 

 

4.2.- Hacer campo de registro Woocommerce NO obligatorio

 

Para hacer que un campo no sea obligatorio de rellenar para poder formalizar el formulario de registro. Es decir, para que el campo no sea requerido, desmarcaremos el checkbox: “Required” y dejaremos marcado el checkbox: “Enabled”

A continuación, haz clic en el botón “Edit Field” y en «Save