Cómo ocultar las etiquetas de opción de imagen con WPForms

Introducción

¿Te gustaría ocultar las etiquetas de las opciones de imagen en los campos de formulario de Opción Múltiple y Casilla de Verificación? Usar la opción de mostrar imágenes para estos campos en lugar de solo etiquetas es una excelente manera de captar la atención de tus visitantes, pero ¿quizás te gustaría dejar que las imágenes hablen por sí solas y eliminar las etiquetas que aparecen debajo de estas imágenes? Usando un pequeño fragmento de CSS puedes ocultar fácilmente las etiquetas para estas imágenes, ¡y en este tutorial te mostraremos exactamente cómo!

Creación de su formulario

Para empezar, crearemos un nuevo formulario y añadiremos nuestros campos. Como ya sabemos que queremos usar imágenes para nuestro campo de Casilla de Verificación, añadiremos este campo y las imágenes correspondientes.

Si necesitas ayuda para crear tu formulario, consulta esta útil guía. Además, si también necesitas ayuda sobre cómo configurar un campo usando las Opciones de Imagen, revisa esta documentación.

Añadir CSS para ocultar las etiquetas de las opciones de imagen

Ahora que el formulario ha sido creado, puedes ver las etiquetas debajo de las imágenes.

Como queremos ocultar estas etiquetas, vamos a añadir algo de CSS para ocultarlas.

Si necesitas ayuda para añadir CSS a tu sitio, consulta este tutorial.

Simplemente copia y pega este CSS en tu sitio.

form.wpforms-form .wpforms-field-container ul.wpforms-image-choices span.wpforms-image-choices-label {
    display: none;
}

Este CSS no solo ocultará las etiquetas que aparecen debajo de las imágenes, sino que también eliminará cualquier margen (espacio) que se aplique automáticamente debajo de las imágenes.

¿Te gustaría también eliminar el espacio en blanco que se coloca alrededor de las opciones de imagen? Echa un vistazo a nuestro artículo sobre Cómo eliminar el espacio en blanco alrededor de las opciones de imagen.