Comment masquer les étiquettes de choix d'image avec WPForms

Introduction

Souhaitez-vous masquer les étiquettes des choix d'images sur les champs de formulaire à Choix multiples et Cases à cocher ? L'utilisation de l'option d'affichage des images pour ces champs au lieu de simples étiquettes est un excellent moyen de capter l'attention de vos visiteurs, mais peut-être souhaitez-vous laisser les images parler d'elles-mêmes et supprimer les étiquettes qui apparaissent sous ces images ? En utilisant un petit extrait de CSS, vous pouvez facilement masquer les étiquettes de ces images et dans ce tutoriel, nous vous montrerons exactement comment !

Création de votre formulaire

Pour commencer, nous allons créer un nouveau formulaire et ajouter nos champs. Comme nous savons déjà que nous voulons utiliser des images pour notre champ Cases à cocher, nous allons ajouter ce champ et les images qui vont avec.

Si vous avez besoin d'aide pour créer votre formulaire, veuillez consulter ce guide utile. De plus, si vous avez également besoin d'aide sur la façon de configurer un champ en utilisant les Choix d'images, veuillez consulter cette documentation.

Ajouter du CSS pour masquer les étiquettes des choix d'images

Maintenant que le formulaire a été créé, vous pouvez voir les étiquettes sous les images.

Comme nous voulons masquer ces étiquettes, nous allons ajouter du CSS pour les masquer.

Si vous avez besoin d'aide pour ajouter du CSS à votre site, veuillez consulter ce tutoriel.

Copiez et collez simplement ce CSS sur votre site.

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

Ce CSS masquera non seulement les étiquettes qui apparaissent sous les images, mais supprimera également toute marge (espacement) appliquée automatiquement sous les images.

Souhaitez-vous également supprimer l'espace blanc autour des choix d'images ? Consultez notre article sur Comment supprimer l'espace blanc autour des choix d'images.