Cómo añadir un campo filtrable a un formulario para uso interno

Introducción

¿Te gustaría añadir un campo filtrable a tu formulario que sea solo para uso interno? Poder filtrar tus entradas de forma rápida y sencilla puede ahorrar mucho tiempo, pero es posible que no quieras que este campo se muestre en tu formulario. En este tutorial, te mostraremos lo fácil que es conseguirlo.

En nuestro ejemplo, vamos a crear un formulario de generación de leads. Una vez verificado el número de teléfono, queremos poder añadir una marca a la entrada para que pueda ser filtrada de los informes más adelante.

Creación del formulario de generación de leads

Nuestro primer paso será crear nuestro formulario y añadir los campos relevantes para que nuestros usuarios los completen.

Sin embargo, también queremos añadir un campo en el que podamos poner nuestra marca más tarde si el número de teléfono ha sido verificado. Para ello, vamos a añadir un campo de formulario de Texto de una sola línea.

Si necesita ayuda para crear su formulario, revise esta documentación.

Añadir una clase CSS al campo filtrable

Dado que queremos que este campo sea solo para uso interno y no queremos que se muestre en el formulario para nuestros visitantes, vamos a añadir una clase CSS a este campo que podremos usar para ocultar este campo con CSS en un paso posterior.

Para añadir una clase CSS al campo, abre la pestaña Avanzado del campo desde el constructor de formularios y añade wpforms-field-hidden a las Clases CSS.

Este nombre de clase CSS es una clase predeterminada en WPForms, el CSS ya está implementado. Una vez que añadas la clase, el CSS para display:none; en el campo se aplicará automáticamente.

Cuando nuestros usuarios visiten el sitio, no podrán ver el campo filtrable de uso interno.

Creación de la vista de columnas

Para este paso, vamos a cambiar la vista de columnas de nuestra pantalla de entradas. Para más información sobre cómo hacerlo, consulta esta documentación.

Queremos que nuestro campo interno se muestre cuando veas la pantalla de entradas.

Ahora, cuando veas la pantalla de entradas, verás todas tus entradas para este formulario, incluido el campo interno que se añadió anteriormente.

Filtrado de las entradas

Ahora, cuando estés en la pantalla de Entradas de tu formulario, puedes filtrar fácilmente estas entradas.

¿Te gustaría también usar CSS para cambiar el color de tu botón de envío? Dirígete a nuestro tutorial sobre Cómo cambiar el color del botón de envío.