Recientemente, un lector nos preguntó cómo agregar opciones de imagen a sus formularios de WordPress. Quizás esto es algo que también te ha preguntado.

En lugar de simplemente mostrar opciones de texto, las imágenes pueden hacer que sus formularios sean más atractivos al instante. Esto puede ayudar a mejorar su tasa de respuesta y generar conversiones.

En este artículo, le mostraremos cómo agregar opciones de imagen en formularios de WordPress para impulsar el compromiso y las conversiones.

¿Qué son las opciones de imagen y por qué utilizarlas en sus formularios?

Las opciones de imagen son fotos, ilustraciones, gráficos o íconos entre los que los usuarios pueden elegir al completar su formulario.

Aquí hay un formulario que usa opciones de imagen, en lugar de opciones de texto normales. Se ha seleccionado la primera opción, Fresas:

Un ejemplo de opciones de imágenes en uso en un formulario: muestra imágenes coloridas para 6 opciones de frutas

La elección de imágenes puede ser una ventaja de muchas maneras. En todos los casos, le permiten hacer que su formulario sea más atractivo y visualmente atractivo.

El uso de imágenes también puede ayudar a 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 tiene un restaurante que ofrece entrega a domicilio, querrá tener un formulario de pedido en su sitio web. Puede utilizar imágenes de sus diferentes platos para ayudar a los clientes potenciales a elegir lo que quieren.

Las opciones de imagen pueden facilitar que sus lectores completen su formulario, especialmente para la audiencia con dificultades de lectura o alguien que no domina su idioma.

Tutorial en video

Suscríbete a

Si prefiere instrucciones escritas, siga leyendo.

Agregar opciones de imagen a sus formularios de WordPress

Para este tutorial, usaremos WPForms plugin. Es el mejor creador de formularios de WordPress. plugin en el mercado y le permite crear formularios fácilmente usando un simple generador de formularios de arrastrar y soltar.

Primero, deberá instalar y activar el WPForms plugin. Si no está seguro de cómo hacerlo, puede obtener instrucciones paso a paso en nuestra guía sobre cómo instalar un WordPress. plugin.

WPForms es un WordPress premium plugin. También ofrecen una versión gratuita llamada WPForms Lite, que también tiene la función de opciones de imagen.

Creando su formulario con WPForms

Una vez que haya activado el plugin, Ve a la WPForms »Agregar formulario página en su panel de WordPress para crear un nuevo formulario.

Creando un nuevo formulario usando WPForms

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.

Utilice la plantilla de formulario de contacto simple

Esto lanzará la interfaz del constructor de WPForms con campos de formulario precargados. Puede editar cualquier campo de formulario haciendo clic en él, moverlo hacia arriba y hacia abajo o eliminarlo.

El formulario predeterminado creado con la plantilla de formulario de contacto de WPForms

A continuación, agregaremos un campo de opción múltiple para que los clientes puedan elegir el tipo de fruta que desean.

Nota: Las opciones de imagen también funcionan con el campo Casillas de verificación. Úselo si desea que su usuario pueda elegir más de una opción.

Para agregar el campo, simplemente arrastre y suelte el campo Opción múltiple de la sección Campos estándar en el lado izquierdo de su pantalla. Lo colocaremos justo encima del cuadro «Comentario o mensaje».

Agregar un campo de opción múltiple a su formulario

Como puede ver, el campo de opción múltiple tiene opciones de texto por defecto. Si hace clic en el campo para editarlo, verá las opciones del campo en el lado izquierdo de la pantalla.

Editar el campo de opción múltiple para su formulario

Aquí, simplemente debe marcar la casilla ‘Usar opciones de imagen’ y WPForms actualizará automáticamente el campo.

La opción 'Usar opciones de imagen' en WPForms

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

Subiendo imágenes para las diferentes opciones en su formulario

Recomendamos utilizar imágenes .jpg o .png que no midan más de 250 px por 250 px. Tus imágenes se verán mejor en tu formulario si todas son del mismo tamaño.

Importante: WPForms no cambiará el tamaño de sus imágenes. Deberá asegurarse de que sean del tamaño que desea antes de cargarlos. Alternativamente, puede editar su imagen en WordPress antes de agregarla a su formulario.

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

Agregar más opciones de opción múltiple a su formulario

Cambiar la forma en que se muestran sus opciones de imagen en su formulario

WPForms facilita el cambio del diseño de la elección de la imagen y otras configuraciones desde la pestaña ‘Opciones avanzadas’.

Abra las Opciones avanzadas para ajustar cómo se muestran sus imágenes

Puede marcar la casilla ‘Aleatorizar opciones’ si desea mostrar sus opciones de imagen al azar, en lugar de en un orden en particular. Esto es útil si está creando una encuesta y desea eliminar el sesgo de la primera opción en los resultados.

En ‘Estilo de elección de imagen’, puede elegir cómo desea diseñar sus imágenes. El estilo predeterminado es Moderno, que se ve así con la opción Fresas seleccionada:

Las opciones de imagen con el estilo moderno predeterminado aplicado

En su lugar, puede elegir el estilo Clásico, que se ve así cuando se selecciona la opción Fresas:

Las opciones de imagen con el estilo clásico aplicado (borde más grueso, sin sombra, sin texto en negrita, sin marca de verificación)

Alternativamente, puede elegir ‘Ninguno’ para el estilo. En este caso, sus imágenes serán simplemente imágenes normales sin bordes ni otros estilos. Las etiquetas se mostrarán con botones de opción.

Las opciones de imagen sin estilo

Si lo desea, también puede cambiar la forma en que se distribuyen sus opciones mediante el menú desplegable «Diseño de opciones». El valor predeterminado es ‘Inline’ y sus opciones aparecen una al lado de la otra hasta que se ajustan a una nueva línea.

En su lugar, puede optar por mostrar sus opciones en varias columnas. Si desea una lista vertical, simplemente elija ‘Una columna’ en el menú desplegable. Sus opciones de imagen se verán así:

Opciones de imagen en una sola columna vertical

También existe la opción aquí para ‘Ocultar 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, podría pedirle a la gente que vote por el nuevo diseño de logotipo que más les guste.

Sin embargo, asegúrese de ingresar una etiqueta relevante y útil siempre que sea posible. Esto se mostrará como texto alternativo para sus imágenes, lo que hará que su sitio sea más accesible para los usuarios con discapacidad visual.

Agregar, eliminar o editar campos en su formulario

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 escriba la etiqueta que desea usar y desmarque la casilla ‘Requerido’ para que el campo sea opcional.

Editando el campo 'Comentario o Mensaje' en WPForms

Para eliminar un campo, pase el cursor sobre él y luego haga clic en el icono rojo de la papelera.

Eliminar un campo en WPForms

Una vez que esté satisfecho con su 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 de su sitio con solo un par de clics. Vamos a crear una nueva página para la nuestra.

Ir Páginas »Agregar 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 búsquelo usando la barra de búsqueda. Luego, simplemente haga clic en el bloque para agregarlo a su página.

Agregar el bloque WPForms a su página o publicación

A continuación, haga clic en el menú desplegable ‘Seleccionar un formulario’ y haga clic en el nombre de su formulario para seleccionarlo. Estamos usando nuestro formulario de pedido de cajas de frutas aquí.

Seleccionando el formulario que desea del menú desplegable WPForms

Ahora está listo para publicar su página y ver su formulario en vivo en su sitio. Así es como se ve el nuestro:

Las opciones de imagen terminadas en el formulario.

Si desea realizar cambios en su formulario, puede encontrarlo en WPForms »Todos los formularios en su tablero. Una vez que haya guardado sus cambios, su formulario también se actualizará automáticamente en su página.

Esperamos que este tutorial le haya ayudado a aprender a agregar opciones de imagen en formularios de WordPress. También le puede gustar nuestra guía sobre cómo crear una encuesta en WordPress y nuestra comparación sobre el mejor creador de páginas de WordPress. plugins.

Si le gustó este artículo, suscríbase a nuestro Canal de Youtube . También puedes encontrarnos en Twitter y Facebook.

.

Entradas relacionadas

Deja una respuesta

Tu dirección de correo electrónico no será publicada.