Comment ajouter des choix d'images dans les formulaires WordPress (Augmenter l'engagement)

Ajouter des choix d'images à vos formulaires WordPress est un excellent moyen d'augmenter l'engagement des utilisateurs et d'améliorer l'expérience globale.

Au lieu d'utiliser des options textuelles standard, les choix d'images permettent aux utilisateurs d'interagir avec vos formulaires de manière plus visuelle et engageante. Cela peut être particulièrement utile pour les sondages, les quiz, les sélections de produits et tout formulaire où vous souhaitez rendre le processus de prise de décision plus intuitif.

Au fil des ans, nous avons créé de nombreux formulaires sur WordPress, ce qui nous a donné des aperçus précieux sur ce qui rend les formulaires attrayants et ce qui pousse les utilisateurs à les abandonner.

Dans cet article, nous vous montrerons comment ajouter facilement des choix d'images dans les formulaires WordPress pour augmenter l'engagement des utilisateurs.

Pourquoi utiliser des choix d'images dans vos formulaires WordPress ?

Les choix d'images sont des photos, des illustrations, des graphiques ou des icônes entre lesquels vos utilisateurs peuvent choisir lorsqu'ils remplissent un formulaire sur votre site Web WordPress.

Voici un exemple de formulaire utilisant des choix d'images plutôt que des options textuelles classiques. Le premier choix, Fraises, a été sélectionné :

Les choix d'images peuvent rendre vos formulaires plus soignés, professionnels et attrayants visuellement, ce qui peut aider les utilisateurs à décider plus rapidement.

Par exemple, si vous gérez un site web de restaurant qui propose la livraison, vous voudrez alors avoir un formulaire de commande sur votre site web. Vous pouvez maintenant utiliser des images de vos différents plats pour aider les clients potentiels à choisir ce qu'ils veulent.

En dehors de cela, les choix d'images peuvent faciliter la tâche d'un public ayant des difficultés de lecture ou de quelqu'un qui ne maîtrise pas votre langue pour remplir votre formulaire, améliorant ainsi l'expérience utilisateur.

Cela dit, voyons comment ajouter facilement des choix d'images dans les formulaires WordPress.

Comment ajouter des choix d'images à vos formulaires WordPress

Vous pouvez facilement ajouter des choix d'images à vos formulaires WordPress avec WPForms pour stimuler l'engagement.

C'est le meilleur plugin constructeur de formulaires WordPress sur le marché et il vous permet de créer facilement des formulaires à l'aide d'un simple constructeur de formulaires par glisser-déposer.

Nous utilisons ce plugin sur plusieurs de nos sites web et avons toujours obtenu d'excellents résultats car il est très convivial et évolutif. Pour en savoir plus sur notre expérience, consultez notre avis sur WPForms.

Tout d'abord, vous devrez installer et activer le plugin WPForms. Pour des instructions détaillées, consultez notre guide étape par étape sur comment installer un plugin WordPress.

Une fois le plugin activé, rendez-vous sur la page WPForms » Ajouter un formulaire dans votre tableau de bord WordPress pour créer un nouveau formulaire.

Cela vous mènera à la page « Sélectionner un modèle », où vous pourrez commencer par taper un nom pour votre formulaire.

Après cela, cliquez sur le bouton « Utiliser le modèle » sous un modèle pré-conçu de votre choix. Pour ce tutoriel, nous utiliserons le modèle « Simple formulaire de contact ».

Cela lancera l'interface du constructeur de formulaires WPForms, où vous verrez un aperçu du formulaire sur le côté droit de l'écran et une colonne avec les champs du formulaire dans le coin gauche.

Vous pouvez maintenant modifier n'importe quel champ de formulaire de votre choix en cliquant dessus, le déplacer de haut en bas, ou le supprimer.

Pour des instructions plus détaillées, vous pouvez consulter notre tutoriel sur comment créer un formulaire de contact dans WordPress.

Ensuite, vous devez ajouter le champ Choix multiples de la colonne de gauche dans l'aperçu du formulaire afin de pouvoir créer des choix d'images pour les clients.

Nous allons le placer juste au-dessus de la boîte « Commentaire ou message ».

Note : Les choix d’images fonctionnent également avec le champ Cases à cocher. Utilisez-le si vous souhaitez que votre utilisateur puisse sélectionner plusieurs options.

Après cela, cliquez sur le champ Choix multiples pour le modifier. Cela ouvrira les options du champ sur le côté gauche de votre écran.

Vous remarquerez maintenant que ce champ vous permet d’ajouter des options de texte par défaut.

Cependant, vous pouvez facilement changer cela en activant le commutateur « Utiliser des choix d’images ».

Une fois que vous aurez fait cela, un bouton « Télécharger une image » apparaîtra sous chaque champ de choix multiples.

Ensuite, vous pouvez taper ce que vous voulez pour l’étiquette du champ, puis cliquer sur le bouton « Télécharger une image ».

Vous pouvez maintenant télécharger une image depuis votre ordinateur ou en sélectionner une dans la médiathèque WordPress.

Nous recommandons d’utiliser des images .jpg ou .png ne dépassant pas 250 px par 250 px.

Gardez à l’esprit que vos images seront plus belles dans votre formulaire si elles sont toutes de la même taille.

Important : WPForms ne redimensionnera pas vos images. Vous devrez vous assurer qu’elles ont la taille souhaitée avant de les télécharger. Alternativement, vous pouvez modifier vos images dans WordPress avant de les ajouter à votre formulaire.

Si vous avez plus de 3 options à inclure, cliquez simplement sur le bouton (+) pour ajouter un nouveau choix. Vous pouvez également utiliser le bouton (-) pour supprimer un choix.

Modifier l’affichage de vos choix d’images dans votre formulaire

WPForms facilite la modification de la mise en page et d’autres paramètres de votre champ de choix d’images.

Pour ce faire, rendez-vous dans l’onglet « Avancé » dans la colonne de gauche.

Vous pouvez maintenant activer le commutateur « Aléatoire des choix » si vous souhaitez afficher vos choix d’images de manière aléatoire plutôt que dans un ordre particulier.

Ceci est utile si vous créez un sondage et souhaitez éliminer les biais de premier choix dans les résultats.

Si vous le souhaitez, vous pouvez également modifier la façon dont vos choix sont présentés à l'aide du menu déroulant « Mise en page des choix ».

Le réglage par défaut est « En ligne », vos choix apparaissant les uns à côté des autres jusqu'à ce qu'ils passent à la ligne suivante.

Vous pouvez choisir d'afficher vos choix dans un certain nombre de colonnes à la place. Si vous souhaitez une liste verticale, choisissez simplement « Une colonne » dans le menu déroulant.

Il y a aussi l'option ici pour « Masquer l'étiquette » pour vos choix d'images. Cela signifie qu'il n'y aura pas de texte sous les images. Dans certains cas, cela peut avoir du sens.

Par exemple, vous pourriez demander aux gens de voter pour le nouveau design de logo qu'ils préfèrent.

Assurez-vous cependant d'entrer une étiquette pertinente et utile dans la mesure du possible. Elle sera affichée comme texte alternatif pour vos images, rendant votre site plus accessible aux utilisateurs malvoyants.

Une fois que vous avez fait cela, revenez à l'onglet « Général » dans la colonne de gauche et faites défiler jusqu'à la section « Style des choix d'images ».

À partir de là, vous pouvez choisir comment vous souhaitez styliser vos images dans le menu déroulant.

Le style par défaut est Moderne, où une coche apparaîtra pour l'image sélectionnée.

Cependant, vous pouvez choisir le style Classique à la place, qui ressemble à ceci lorsqu'une option est sélectionnée :

Alternativement, vous pouvez également choisir « Aucun » pour le style.

Dans ce cas, vos images seront simplement des images ordinaires sans bordure ni autre style. Les étiquettes seront affichées avec des boutons radio.

Une fois que votre formulaire vous convient, cliquez simplement sur le bouton « Enregistrer » en haut de l'écran.

Ajout de votre formulaire à votre site web

Vous pouvez ajouter votre formulaire à n'importe quel article ou page de votre site en quelques clics. Nous allons créer une nouvelle page pour la nôtre.

Tout d'abord, accédez à l'écran Pages » Ajouter dans la barre latérale d'administration de WordPress et cliquez sur le bouton « Ajouter un bloc » (+) dans le coin supérieur gauche de l'écran.

Cela ouvrira le menu des blocs à partir duquel vous devrez trouver et ajouter le bloc WPForms à la page.

Après cela, sélectionnez le formulaire que vous venez de créer dans le menu déroulant du bloc lui-même.

Enfin, cliquez sur le bouton « Publier » ou « Mettre à jour » pour enregistrer les paramètres de votre formulaire.

Maintenant, visitez votre site Web pour voir les choix d'images dans votre formulaire WordPress.

Si vous souhaitez apporter d'autres modifications à votre formulaire, vous pouvez le faire facilement en visitant la page WPForms » Tous les formulaires depuis le tableau de bord WordPress.

Une fois sur place, cliquez sur votre formulaire pour l'ouvrir dans le constructeur de formulaires.

Après avoir effectué vos modifications, cliquez simplement sur le bouton « Enregistrer » pour enregistrer vos modifications. Votre formulaire sera également automatiquement mis à jour sur votre page.

Bonus : Acceptez des images avec vos formulaires WordPress

En plus de proposer des choix d'images, vous pouvez également accepter des images d'autres utilisateurs avec un formulaire WordPress.

Cela peut être utile si vous êtes un photographe cherchant à embaucher quelqu'un ou si vous organisez un concours de photographie.

En dehors de cela, accepter du contenu généré par les utilisateurs peut même aider à stimuler l'engagement des utilisateurs sur votre site Web.

Vous pouvez facilement créer un formulaire de téléchargement de fichiers dans WordPress avec WPForms car c'est le meilleur plugin de téléchargement de fichiers sur le marché.

Il est livré avec un modèle de formulaire de téléchargement de fichiers prédéfini que vous pouvez utiliser pour accepter tout type de document, y compris jpeg, png, gif, pdf, ppt, et plus encore.

Pour accepter des images, vous devez simplement cliquer sur le champ « Téléchargement de fichier » pour ouvrir ses paramètres dans la colonne de gauche. Ensuite, vous devez entrer les types de fichiers image que vous souhaitez accepter sous l'option « Extensions de fichiers autorisées ».

Une fois que vous êtes satisfait, n'oubliez pas de cliquer sur le bouton « Enregistrer » pour sauvegarder vos paramètres.

Vous pouvez ensuite ajouter le formulaire à votre site Web avec le bloc WPForms convivial. Pour des instructions plus détaillées, consultez notre tutoriel sur comment créer un formulaire de téléchargement de fichiers dans WordPress.

Tutoriel vidéo

Si vous préférez des instructions visuelles, vous pouvez consulter notre tutoriel vidéo.

S'abonner à WPBeginner

Nous espérons que cet article vous a aidé à apprendre comment ajouter des choix d'images dans les formulaires WordPress. Vous voudrez peut-être aussi consulter notre guide pour débutants sur comment créer un sondage interactif sur votre site WordPress et notre comparaison des meilleurs plugins de calculatrice WordPress.

Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.