Récemment, un lecteur nous a demandé comment ajouter des choix d’images à leurs formulaires WordPress. C’est peut-être quelque chose que vous vous demandez aussi.
Au lieu de simplement afficher des choix de texte, les images peuvent instantanément rendre vos formulaires plus attrayants. Cela peut aider à améliorer votre taux de réponse et les conversions de formulaire.
Dans cet article, nous allons vous montrer comment ajouter des choix d’images dans les formulaires WordPress pour stimuler l’engagement et les conversions.
Que sont les choix d’images et pourquoi les utiliser dans vos formulaires ?
Les choix d’images sont des photos, des illustrations, des graphiques ou des icônes parmi lesquels vos utilisateurs peuvent choisir lorsqu’ils remplissent votre formulaire.
Voici un formulaire utilisant des choix d’images, plutôt que des options de texte normales. Le premier choix, Fraises, a été sélectionné :
Les choix d’images peuvent être un avantage à bien des égards. Dans tous les cas, ils vous permettent de rendre votre formulaire plus attrayant et visuellement attrayant.
L’utilisation d’images peut également aider à rendre vos formulaires plus soignés et professionnels. Ils peuvent également aider les utilisateurs à décider plus rapidement.
Par exemple, si vous dirigez un restaurant qui propose la livraison, vous voudrez avoir un bon de commande sur votre site Web. Vous pouvez utiliser des images de vos différents plats pour aider les clients potentiels à choisir ce qu’ils veulent.
Les choix d’images peuvent permettre à vos lecteurs de remplir plus facilement votre formulaire, en particulier pour un public ayant des difficultés de lecture ou quelqu’un qui ne parle pas couramment votre langue.
Didacticiel vidéo
Si vous préférez des instructions écrites, continuez à lire.
Ajouter des choix d’images à vos formulaires WordPress
Pour ce tutoriel, nous utiliserons WPForms brancher. C’est le meilleur plugin de création de formulaires WordPress sur le marché et vous permet de créer facilement des formulaires à l’aide d’un simple générateur de formulaires par glisser-déposer.
Tout d’abord, vous devez installer et activer le Plugin WPForms. Si vous ne savez pas comment procéder, vous pouvez obtenir des instructions étape par étape dans notre guide sur la façon d’installer un plugin WordPress.
WPForms est un plugin WordPress premium. Ils offrent également une version gratuite appelée WPForms Lite, qui dispose également de la fonction de choix d’images.
Créer votre formulaire avec WPForms
Une fois que vous avez activé le plugin, allez dans le WPForms » Ajouter un formulaire page dans votre tableau de bord WordPress pour créer un nouveau formulaire.
Donnez d’abord un nom à votre formulaire, puis cliquez pour sélectionner un modèle. Nous utiliserons le formulaire de contact simple comme point de départ.
Cela lancera l’interface du générateur WPForms avec des champs de formulaire préchargés. Vous pouvez modifier n’importe quel champ de formulaire en cliquant dessus, le déplacer de haut en bas ou le supprimer.
Ensuite, nous allons ajouter un champ à choix multiples afin que les clients puissent choisir le type de fruit qu’ils souhaitent.
Noter: Les choix d’images fonctionnent également avec le champ Cases à cocher. Utilisez-le si vous voulez que votre utilisateur puisse choisir plus d’une option.
Pour ajouter le champ, faites simplement glisser et déposez le champ Choix multiples depuis la section Champs standard sur le côté gauche de votre écran. Nous allons le placer juste au-dessus de la case « Commentaire ou Message ».
Comme vous pouvez le voir, le champ à choix multiples a des options de texte par défaut. Si vous cliquez sur le champ pour le modifier, vous verrez les options de champ sur le côté gauche de votre écran.
Ici, il vous suffit de cocher la case « Utiliser les choix d’images » et WPForms mettra automatiquement à jour le champ.
Vous pouvez saisir ce que vous voulez pour l’étiquette de texte du champ, puis cliquez sur le bouton « Télécharger l’image ». Vous pouvez télécharger une image depuis votre ordinateur ou en sélectionner une dans la médiathèque WordPress.
Nous vous recommandons d’utiliser des images .jpg ou .png qui ne dépassent pas 250px par 250px. 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’ils ont la taille souhaitée avant de les télécharger. Alternativement, vous pouvez modifier votre image dans WordPress lui-même 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 utiliser le bouton (-) pour supprimer un choix.
Modification de l’affichage de vos choix d’images sur votre formulaire
WPForms permet de modifier facilement la disposition du choix d’image et d’autres paramètres à partir de l’onglet « Options avancées ».
Vous pouvez cocher la case « Randomiser les 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 une enquête et que vous souhaitez éliminer le biais de premier choix dans les résultats.
Sous « Style de choix d’image », vous pouvez choisir le style de vos images. Le style par défaut est Moderne, qui ressemble à ceci avec l’option Fraises sélectionnée :
Vous pouvez choisir le style Classique à la place, qui ressemble à ceci lorsque l’option Fraises est sélectionnée :
Alternativement, vous pouvez choisir « Aucun » pour le style. Dans ce cas, vos images seront simplement des images normales sans bordure ni autre style. Les étiquettes seront affichées avec des boutons radio.
Si vous le souhaitez, vous pouvez également modifier la présentation de vos choix, à l’aide de la liste déroulante « Mise en page des choix ». La valeur par défaut est « Inline » avec vos choix apparaissant les uns à côté des autres jusqu’à ce qu’ils s’enroulent sur une nouvelle ligne.
Vous pouvez choisir d’afficher vos choix dans un certain nombre de colonnes à la place. Si vous voulez une liste verticale, choisissez simplement « Une colonne » dans la liste déroulante. Vos choix d’images ressembleront alors à ceci :
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, il peut être judicieux de le faire. Par exemple, vous pourriez demander aux gens de voter pour le nouveau design de logo qu’ils préfèrent.
Assurez-vous cependant de saisir une étiquette pertinente et utile dans la mesure du possible. Cela sera affiché sous forme de texte alternatif pour vos images, rendant votre site plus accessible aux utilisateurs malvoyants.
Ajouter, supprimer ou modifier des champs sur votre formulaire
Vous pouvez ajouter, supprimer ou modifier les champs de votre formulaire. Pour modifier un champ, il suffit de cliquer dessus.
Par exemple, vous souhaiterez peut-être modifier le champ « Commentaire ou Message » pour qu’il soit facultatif et qu’il ait une étiquette différente. Après avoir cliqué sur le champ, vous pouvez le modifier sur le côté gauche de l’écran.
Tapez simplement l’étiquette que vous souhaitez utiliser et décochez la case « Obligatoire » pour rendre le champ facultatif.
Pour supprimer un champ, passez votre curseur dessus puis cliquez sur l’icône de corbeille rouge.
Une fois que vous êtes satisfait de votre formulaire, cliquez sur le bouton « Enregistrer » en haut de l’écran.
Ajouter 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.
Aller à Pages » Ajouter un nouveau, puis cliquez sur le bouton (+) pour ajouter un bloc à votre page.
Recherchez le bloc WPForms dans la section Widgets ou recherchez-le à l’aide de la barre de recherche. Ensuite, cliquez simplement sur le bloc pour l’ajouter à votre page.
Ensuite, cliquez sur le menu déroulant « Sélectionner un formulaire » et cliquez sur le nom de votre formulaire pour le sélectionner. Nous utilisons ici notre formulaire de commande de boîtes de fruits.
Vous êtes maintenant prêt à publier votre page et à voir votre formulaire en direct sur votre site. Voici à quoi ressemble le nôtre :
Si vous souhaitez apporter des modifications à votre formulaire, vous pouvez le trouver sous WPForms » Tous les formulaires dans votre tableau de bord. Une fois que vous avez enregistré vos modifications, votre formulaire sera automatiquement mis à jour sur votre page également.
Nous espérons que ce didacticiel vous a aidé à apprendre comment ajouter des choix d’images dans les formulaires WordPress. Vous aimerez peut-être également notre guide sur la création d’un sondage dans WordPress et notre comparaison des meilleurs plugins de création de pages WordPress.
