Cómo agregar opciones de imagen en formularios de WordPress (impulsar el compromiso)

Recientemente, un lector nos preguntó cómo agregar opciones de imagen a sus formularios de WordPress. Tal vez eso es lo que preguntaste. En lugar de mostrar solo opciones de texto, las imágenes pueden hacer que los formularios sean más atractivos. Esto puede ayudarlo a mejorar su tasa de respuesta y sus conversiones de forma. En este artículo, le mostraremos cómo agregar opciones de imagen en formularios de WordPress para estimular la participación y las conversiones.

¿Cuáles son las opciones de imagen y por qué usarlas en sus formularios? Las opciones de imagen son fotos, ilustraciones, gráficos o iconos entre los cuales los usuarios pueden elegir al completar el formulario.
Aquí hay un formulario que utiliza opciones de imagen, en lugar de opciones de texto ordinarias. Se seleccionó la primera opción, Strawberries,:

Las opciones de imagen pueden ser una ventaja de muchas maneras. En todos los casos, le permiten hacer que su forma sea más atractiva y más atractiva visualmente. El uso de imágenes también puede ayudarlo a hacer que sus formularios se vean más pulidos y profesionales. También pueden ayudar a los usuarios a decidir más rápido. Por ejemplo, si conduce un restaurante que ofrece entrega, querrá tener un formulario de pedido en su sitio web. Puede usar imágenes de diferentes platos para ayudar a los clientes potenciales a elegir lo que quieran.
Las opciones de imagen pueden facilitar a sus lectores completar su formulario, especialmente para el público con dificultades de lectura o para alguien que no conozca fluido en el video de su tutorial
Suscríbete a WPBeginner
Si prefiere instrucciones escritas, continúe leyendo. Agregar opciones de imagen a sus formularios de WordPress para este tutorial, utilizaremos el complemento WPFORMS. Es el mejor complemento de WordPress para el constructor de formulaciones en el mercado y le permite crear fácilmente formularios utilizando un simple constructor y caída de formulación. Primero, deberá instalar y activar el complemento WPFFORMS. Si no está seguro de cómo hacer esto, puede obtener instrucciones de paso por paso en nuestra guía sobre cómo instalar un complemento de WordPress .WPPFORMS es un complemento premium de WordPress. También ofrece una versión gratuita llamada WPForms Lite, que también tiene la función de elegir la imagen. Creando su formulario con WPFORMS Después de haber activado el complemento, vaya a la página WPFFORMS »Agregue el formulario al tablero de WordPress para crear un nuevo formulario.
Primero proporcione un nombre para su formulario y luego haga clic para seleccionar una plantilla. Usaremos el formulario de contacto simple como punto de partida.

Esto iniciará la interfaz WPForms Builder con los campos de formulario precargados. Puede editar cualquier forma de formulario haciendo clic en él, moviéndolo hacia arriba y hacia abajo o limpiándolo.

A continuación, agregaremos un campo con múltiples opciones, para que los clientes puedan elegir el tipo de fruta que desean. Nota: Las opciones de imagen también funcionan con el campo de los cuadros de selección. Use esto si desea que su usuario pueda elegir más opciones. Para agregar el campo, simplemente deslice y arregle el campo con múltiples opciones en la sección de campo estándar de la pantalla. Lo colocaremos justo encima del cuadro “Comentario o mensaje”.

Como puede ver, el campo con múltiples opciones tiene opciones de texto de forma predeterminada. Si hace clic en el campo para editarlo, verá las opciones de campo en el lado izquierdo de la pantalla. Aquí, simplemente debe verificar el cuadro “Usar opciones de imagen” y WPForms actualizará automáticamente el campo.

Puede ingresar todo lo que desee para la etiqueta de texto de campo y luego hacer clic en el botón “Cargar la imagen”. Puede cargar una imagen desde su computadora o seleccionar una de la biblioteca de medios de WordPress.

Recomendamos usar imágenes .jpg o .png que no excedan 250 x 250 px. Sus imágenes se verán mejor en su forma si tienen el mismo tamaño.

IMPORTANTE: WPFORMS no cambiará el tamaño de sus imágenes. Deberá asegurarse de que tengan el tamaño deseado antes de cargarlos. Alternativamente, puede editar su imagen en WordPress antes de agregarla al formulario.

Si tiene más de 3 opciones para incluir, simplemente haga clic en el botón (+) para agregar una nueva opción. Puede usar el botón (-) para eliminar una opción.

Cambiar cómo su imagen elige en su formulario. WPFFORMS facilita el cambio de la apariencia de la imagen y otras configuraciones en la pestaña “Opciones avanzadas”.
Puede verificar el cuadro “Opciones de azar” si desea mostrar las opciones de imagen al azar, en lugar de en un determinado orden. Esto es útil si crea una encuesta y desea eliminar el sesgo de primera opción.

Bajo el “estilo de elegir la imagen”, puede elegir cómo desea estilizar sus imágenes. El estilo predeterminado es moderno, que se parece a la opción de fresas seleccionada:

Puede elegir el estilo clásico, que se muestra cuando se seleccionan las fresas: alternativamente, puede elegir “Ninguno” para el estilo. En este caso, sus imágenes simplemente serán imágenes ordinarias sin fronteras u otro estilo. Las etiquetas se mostrarán con botones de radio.
Si lo desea, también puede cambiar la forma en que se presentan sus elecciones, utilizando el menú “Elección de diseño”. Por defecto, está “en línea”, con sus opciones que aparecen una al lado de la otra hasta que se envuelven en una nueva línea.

Puede elegir mostrar sus opciones en varias columnas. Si desea una lista vertical, simplemente elija “una columna” en el menú Drop -down. Sus opciones de imagen se verán así:

También existe la opción de “ocultar la etiqueta” para sus opciones de imagen. Esto significa que no habrá texto debajo de las imágenes. En algunos casos, puede tener sentido hacer esto. Por ejemplo, puede pedirle a la gente que vote sobre qué nuevo diseño de logotipos les gusta más. Sin embargo, asegúrese de ingresar una etiqueta relevante y útil, cuando sea posible. Se mostrará como un texto alternativo para sus imágenes, lo que hace que su sitio sea más accesible para los usuarios con discapacidades visuales.

Agregar, eliminar o editar campos en su formulario que puede agregar, eliminar o editar los campos en su formulario para editar un campo, simplemente haga clic en él. Por ejemplo, es posible que desee cambiar el campo “Comentario o mensaje” para que sea opcional y tenga una etiqueta diferente. Después de hacer clic en el campo, puede editarlo en el lado izquierdo de la pantalla. Simplemente ingrese la etiqueta que desea usar y corte la caja “requerida” para hacer el campo opcional. Para eliminar un campo, cruzar el cursor sobre ella, luego haga clic en el icono de basura roja.
Después de estar satisfecho con el formulario, haga clic en el botón “Guardar” en la parte superior de la pantalla. Agregar su formulario a su sitio web Puede agregar su formulario a cualquier publicación o página en su sitio con solo unos pocos clics. Crearemos una nueva página para la nuestra. Páginas de acceso »Agregue NUEVO, luego haga clic en el botón (+) para agregar un bloque a su página. Busque el bloque WPForms en la sección Widgets o busquelo usando la barra de búsqueda. Luego haga clic en el bloque para agregarlo a su página.

Luego, haga clic en el menú de caída “Seleccionar un formulario” y haga clic en el nombre de su formulario para seleccionarlo. Usamos el formulario de pedido para la caja de frutas aquí.
Ahora está listo para publicar su página y ver el formulario en vivo en su sitio. Esto es lo que nuestro