Comment configurer un champ déroulant à sélection multiple dans WordPress (en toute simplicité)

Avez-vous besoin d'ajouter un champ déroulant à sélection multiple dans WordPress ? Les listes déroulantes à sélection multiple sont un excellent moyen de permettre aux utilisateurs de choisir plus d'une option dans une liste.

Dans cet article, nous allons vous montrer un moyen simple et rapide de créer votre propre liste déroulante à sélection multiple. Vous n'avez pas besoin d'écrire de code pour créer la liste déroulante et l'ajouter à votre site Web.

Créez votre formulaire WordPress maintenant

Comment sélectionner plusieurs options dans une liste déroulante ?

En utilisant WPForms, vous pouvez définir n'importe quelle liste déroulante comme une liste déroulante à sélection multiple.

Lorsque votre visiteur clique sur un élément de la liste, la liste déroulante reste ouverte afin qu'il puisse faire plus de sélections.

Cette liste déroulante vous permet également de rechercher parmi les choix. C'est donc parfait pour les longues listes, comme une liste déroulante de pays.

Nous allons vous montrer comment créer vous-même une liste déroulante à sélection multiple.

Comment configurer un champ déroulant à sélection multiple dans WordPress

Jetons un coup d'œil aux étapes que nous allons suivre dans ce didacticiel.

1. Installer le plugin WPForms
2. Créez votre formulaire
3. Ajouter un champ déroulant à sélection multiple à votre formulaire
4. Publiez votre formulaire sur votre site Web

OK, commençons par installer le plugin que nous allons utiliser.

Étape 1 : Installez le plugin WPForms

WPForms est le meilleur constructeur de formulaires pour WordPress. Il est très facile de créer n'importe quel formulaire pour votre site Web à l'aide du générateur de glisser-déposer.

Pour commencer à créer votre formulaire, vous devrez installer et activer le plugin WPForms dans WordPress. Si vous avez besoin d'aide pour cette étape, consultez ce guide du débutant pour installer un plugin.

Tout est prêt ? Passons à autre chose et créons votre premier formulaire.

Étape 2 : créez votre formulaire

Nous allons maintenant créer un formulaire de base et y ajouter une liste déroulante.

Dans cet exemple, nous allons créer un formulaire de bénévolat avec un sélecteur de date et une liste déroulante.

WPForms propose un excellent modèle de formulaire de candidature pour les bénévoles. Mais pour cet exemple, nous allons plutôt utiliser le simple formulaire de contact comme point de départ.

Pour commencer, ouvrez votre tableau de bord WordPress et cliquez sur WPForms » Ajouter un nouveau .

Allez-y et tapez un nom pour votre formulaire en haut. Cliquez ensuite sur le modèle de formulaire de contact simple pour l'ouvrir dans votre navigateur.

Maintenant que le modèle est ouvert, vous verrez que nous avons déjà 3 champs :

• Nom
• E-mail
• Commentaire ou message

Ajoutons un champ de date pour que la personne remplissant le formulaire puisse choisir le jour où elle souhaite apporter son aide.

Tout d'abord, continuez et faites glisser un champ Date / Heure du côté gauche du générateur de formulaires vers le côté droit. Cliquez ensuite une fois sur le champ Date/Heure pour ouvrir les paramètres.

Il y a 2 paramètres de base que nous allons personnaliser ici :

• Modifiez le texte de l' étiquette en fonction de votre formulaire
• Utilisez le menu déroulant pour le changer en un champ Date uniquement.

Faites maintenant défiler jusqu'à Options avancées et cliquez dessus pour développer les paramètres.

Nous ne voulons des volontaires que les jours de semaine, alors cliquons sur Limiter les jours pour que les week-ends soient grisés. Pour ce faire, sélectionnez simplement du lundi au vendredi :

OK, c'est fait, nous pouvons donc cliquer sur Enregistrer .

Passons à l'ajout de notre liste déroulante à sélection multiple.

Étape 3 : Ajoutez un champ déroulant à sélection multiple à votre formulaire

Dans cette étape, nous allons ajouter un champ déroulant, puis le personnaliser pour accepter plusieurs sélections.

Tout d'abord, faisons glisser une liste déroulante sur le formulaire. Cliquez ensuite sur le champ pour que les paramètres s'ouvrent sur la gauche.

Si vous le souhaitez, vous pouvez remplir automatiquement la liste déroulante à partir d'autres parties de WordPress, comme vos publications ou vos produits. Vous pouvez découvrir comment utiliser les choix de champ dynamiques dans cet article.

Mais si vous souhaitez coder en dur la liste, WPForms vous facilite la tâche. Il est livré avec des listes prédéfinies utiles pour les champs déroulants. Pour accélérer les choses, nous allons ajouter une liste d'États américains utilisant l'un des préréglages.

Tout d'abord, allez-y et cliquez sur Ajouter en bloc dans les paramètres du champ déroulant.

Et puis cliquez sur Afficher les préréglages pour ouvrir toutes les listes de préréglages disponibles.

Maintenant, cliquons sur États pour obtenir automatiquement une liste des États américains que nous pouvons ajouter à la liste déroulante de sélection multiple.

Vous verrez la liste complète des états remplir automatiquement la zone Choix . Cliquez sur Ajouter de nouveaux choix pour les ajouter en tant que choix de réponse.

Avez-vous remarqué que le champ déroulant a 3 réponses par défaut ? N'oubliez pas de cliquer sur le signe moins à côté de ces choix par défaut pour les supprimer.

D'accord, ce sont tous nos choix de réponses configurés dans le champ déroulant.

Tout ce que nous devons faire maintenant est de dire à WPForms que nous voulons que ce soit un champ à sélection multiple.

Pour ce faire, nous allons faire défiler vers le bas sur le côté gauche et développer Options avancées .

Sélectionnons la sélection d' options multiples dans cette section.

Il y a un autre changement important à faire juste en dessous.

Modifions le style de ce champ en une liste déroulante Moderne .

Vous vous demandez pourquoi nous avons changé ce champ en style Moderne ?

Il y a 3 raisons pour lesquelles ce champ fonctionne mieux pour une liste déroulante à sélection multiple :

• Le champ Style moderne affiche une ligne avec une flèche pour développer la liste. Il est donc plus compact que le style Classique, qui affiche toujours 4 rangées.
• Le champ Style moderne vous permet de cliquer sur plusieurs entrées sans appuyer sur aucune touche du clavier. Avec le champ Classique , votre visiteur devra maintenir la touche Contrôle ou Commande de son clavier enfoncée pour sélectionner plus d'une entrée à la fois.
• Et comme nous l'avons mentionné en haut, la liste déroulante de sélection multiple de style moderne comporte une zone de recherche, ce qui facilite la recherche rapide de l'élément que vous souhaitez.

OK, nous avons donc configuré notre liste déroulante comme nous le voulons. Enregistrons nos progrès jusqu'à présent en cliquant sur le bouton Enregistrer en haut du générateur de formulaires.

Nous pouvons maintenant publier le formulaire. C'est la dernière étape, et cela ne prend que quelques minutes.

Étape 4 : Publiez votre formulaire sur votre site Web

Maintenant que nous avons rempli le formulaire, il est temps de le publier sur votre site WordPress.

WPForms vous permet de publier vos formulaires où vous le souhaitez. Vous pouvez les ajouter à :

• Des postes
• Pages
• Barres latérales
• Le pied de page WordPress.

Dans cet exemple, créons une nouvelle page pour le formulaire.

Pour commencer, cliquez sur Intégrer en haut du générateur de formulaires.

Maintenant, allons de l'avant et cliquez sur Créer une nouvelle page .

Saisissez un nom pour votre page, puis cliquez sur Let's Go .

WordPress ouvrira la nouvelle page et affichera un aperçu de votre formulaire. Cliquez sur le bouton bleu Publier ou Mettre à jour en haut à droite.

Maintenant, votre liste déroulante à sélection multiple est en ligne et prête à être utilisée.

Et c'est tout! Vous avez appris à créer facilement une liste déroulante à sélection multiple dans WordPress.

Créez votre formulaire WordPress maintenant

Étape suivante : divisez votre formulaire en pages

Si vous cherchez des moyens de rendre votre formulaire plus compact, pensez à le diviser en plusieurs pages. Cela peut rendre les formulaires longs beaucoup plus faciles à traiter.

Pour savoir comment ajouter des sauts de page à un formulaire, lisez notre guide pour créer un formulaire en plusieurs étapes.

Prêt à créer votre formulaire ? Commencez dès aujourd'hui avec le plugin de création de formulaires WordPress le plus simple. WPForms Pro comprend de nombreux modèles gratuits et offre une garantie de remboursement de 14 jours.

Si cet article vous a aidé, veuillez nous suivre sur Facebook et Twitter pour plus de tutoriels et guides WordPress gratuits.