How To Easily Add Image Choices In A Wordpress Form

Cómo agregar opciones de imagen en formularios de WordPress

Recientemente, un lector nos preguntó cómo agregar opciones de imágenes a sus formularios de WordPress. Quizás esto sea algo que también te esté preguntando. En lugar de simplemente mostrar opciones de texto, las imágenes pueden hacer que sus formularios sean más atractivos al instante. Puede ayudarlo 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?

Contents

Las opciones de imagen son fotos, ilustraciones, gráficos o íconos entre los que los usuarios pueden elegir cuando completan su formulario. Aquí hay un formulario que usa opciones de imagen, en lugar de opciones de texto estándar. Se seleccionó la primera opción, Fresas:

Un Ejemplo De Una Elección De Imagen 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 formas. De cualquier manera, 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 prolijos 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 una audiencia con dificultades de lectura o alguien que no domina su idioma.

Video tutorial

Suscríbase a MundoCMS Si prefiere instrucciones escritas, siga leyendo.

Agregue opciones de imagen a sus formularios de WordPress

Para este tutorial, usaremos el complemento WPForms. Es el mejor complemento de creación de formularios de WordPress del mercado y le permite crear formularios fácilmente con un simple generador de formularios de arrastrar y soltar. Primero, deberá instalar y activar el complemento WPForms. Si no sabe cómo hacer esto, puede obtener instrucciones paso a paso en nuestra guía sobre cómo instalar un complemento de WordPress. WPForms es un complemento premium de WordPress. También ofrecen una versión gratuita llamada WPForms Lite, que también tiene la función de elegir imágenes.
Creando su formulario con WPForms
Una vez que haya activado el complemento, vaya a la WPForms »Agregar un formulario página en su panel de WordPress para crear un nuevo formulario.
Creando Un Nuevo Formulario Usando Wpforms
Primero dé un nombre a su formulario, luego haga clic para seleccionar una plantilla. Utilizaremos 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 los campos de formulario precargados. Puede editar cualquier campo de formulario haciendo clic en él, arrastrándolo hacia arriba y hacia abajo o eliminándolo.
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.
Notar: 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 de Opción múltiple de la sección Campos estándar en el lado izquierdo de su pantalla. Lo colocaremos justo encima del área «Comentario o mensaje».
Agregue Un Campo De Opción Múltiple A Su Formulario
Como puede ver, el campo de opción múltiple tiene opciones de texto predeterminadas. Si hace clic en el campo para editarlo, verá las opciones del campo en el lado izquierdo de la pantalla.
Edite El Campo De Opción Múltiple De Su Formulario
Aquí solo necesita 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.
Descarga Imágenes Para Las Diferentes Opciones De Tu Formulario
Le recomendamos que utilice imágenes .jpg o .png que no midan más de 250 píxeles por 250 píxeles. Sus imágenes se verán mejor en su forma 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 descargarlos. 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.
Agregue Más Opciones De Opción Múltiple A Su Formulario
Cambiar la visualización de sus opciones de imagen en su formulario
WPForms hace que sea fácil cambiar el diseño de la opción de imagen y otras configuraciones desde la pestaña «Opciones avanzadas».
Abra Las Opciones Avanzadas Para Refinar La Visualización De Sus Imágenes
Puede marcar la casilla «Elección aleatoria» 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 primera elección en los resultados. En «Estilo de elección de imagen» puede elegir el estilo de sus imágenes. El estilo predeterminado es Moderno, que se ve así con la opción Fresas seleccionada:
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 Fresas:
Opciones De Imagen Con El Estilo Clásico Aplicado (Borde Más Grueso, Sin Sombra, Sin Texto En Negrita, Sin Marca De Verificación)
También puede elegir «Ninguno» para el estilo. En este caso, sus imágenes serán imágenes normales sin bordes ni otros estilos. Las etiquetas se mostrarán con botones de opción.
Opciones De Imagen Sin Estilo
Si lo desea, también puede modificar la presentación de sus opciones utilizando la lista desplegable «Disposición de opciones». El valor predeterminado es «Inline» y sus opciones aparecen una al lado de la otra hasta que terminan en 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 la lista desplegable. Sus opciones de imagen se verán así:
Elección De Imágenes 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, esto puede ser una buena idea. Por ejemplo, podría pedirle a la gente que vote por su nuevo diseño de logotipo favorito. Sin embargo, asegúrese de ingresar una etiqueta relevante y útil cuando 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 modificar campos en su formulario
Puede agregar, eliminar o modificar los campos de 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.
Modificación Del Campo
Para eliminar un campo, coloque 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 en su sitio con solo unos pocos clics. Crearemos una nueva página para la nuestra. Ir a 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, haz clic en el bloque para agregarlo a tu 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. Usamos nuestro formulario de pedido de cajas de frutas aquí.
Seleccionar El Formulario Deseado De La Lista Desplegable De 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 cómo agregar opciones de imagen en formularios de WordPress. También puede que le guste nuestra guía para crear una encuesta en WordPress y nuestra comparación de los mejores complementos de creación de páginas de WordPress. Si le gustó este artículo, suscríbase a nuestro canal de YouTube para ver tutoriales en video de WordPress. También puede encontrarnos en Twitter y Facebook.

Originally posted 2021-02-25 11:15:37.

Leave a Reply