Comment créer un formulaire de réservation WordPress multi-sites

Gérer les réservations sur plusieurs sites peut être un cauchemar sans les bons outils, surtout lorsque les clients ont besoin de savoir où vous êtes situés avant de réserver.

Avec WPForms et le module complémentaire Géolocalisation, vous pouvez créer un formulaire de réservation multi-sites WordPress qui affiche tous vos sites sur une carte interactive et permet aux visiteurs de choisir leur emplacement préféré.

Ce guide vous accompagne dans la création d'un formulaire de réservation qui affiche plusieurs bureaux, centres de service ou lieux d'événements sur une seule carte, permettant aux clients de trouver et de réserver facilement à l'endroit le plus proche.

Créez votre formulaire WordPress multi-sites dès maintenant ! 🙂

Comment créer un formulaire de réservation WordPress multi-sites

Pour créer un formulaire de réservation multi-sites dans WordPress, vous aurez besoin d'un plugin capable d'effectuer le travail le plus important, et WPForms est celui que je recommande toujours. Suivez les étapes ci-dessous pour commencer :

Étape 1 : Installer le plugin WPForms Pro

WPForms est un excellent outil pour créer des formulaires tels que des formulaires de contact et des formulaires de réservation. Il propose plus de 2 100+ modèles de formulaires WordPress que vous pouvez utiliser.

Ce que j'aime le plus chez WPForms, c'est la façon dont il combine des fonctionnalités de formulaire puissantes avec des outils de géolocalisation intégrés. Vous n'êtes pas obligé de combiner plusieurs plugins ou d'écrire du code personnalisé.

Pour créer un formulaire de réservation multi-sites dans WordPress, vous aurez besoin de WPForms Pro, qui inclut le module complémentaire Géolocalisation et le champ Carte dont vous aurez besoin pour ce tutoriel.

Pour commencer, achetez la licence Pro. Ensuite, installez WPForms sur votre site Web. Si vous avez besoin d’aide, suivez ces instructions sur la manière d’ajouter un plugin à WordPress.

Passez à WPForms Pro maintenant ! 🙂

Étape 2 : Activer le module complémentaire Géolocalisation

Avant de pouvoir ajouter une carte interactive à votre formulaire de réservation, vous devrez installer le module complémentaire Géolocalisation. C'est ce qui alimente le champ Carte.

Pour commencer, allez dans WPForms » Modules complémentaires dans votre tableau de bord WordPress. Dans la barre de recherche, tapez « Géolocalisation » pour trouver rapidement le module complémentaire.

Une fois qu'il apparaît, cliquez sur Installer le module complémentaire. L'installation ne prend généralement que quelques secondes. Après cela, cliquez sur Activer pour l'activer sur votre site.

Maintenant, voici la partie qui pose parfois problème : le module complémentaire Géolocalisation nécessite une clé API Google Places ou Mapbox pour que le champ Carte puisse fonctionner correctement.

Je sais que cela semble technique, mais WPForms propose un guide étape par étape qui le rend beaucoup plus facile que cela n'y paraît. Pour des instructions de configuration complètes, consultez la documentation du module d'extension Géolocalisation.

Il vous guide dans l'activation des API requises pour Google Places ou Mapbox, puis dans la saisie de cette clé dans WPForms » Paramètres » Géolocalisation.

Une fois que vous avez ajouté votre clé API et enregistré les paramètres, vous êtes prêt. Le module d'extension Géolocalisation est maintenant prêt à être utilisé, et vous pouvez commencer à ajouter des cartes interactives à vos formulaires.

Étape 3 : Créer un nouveau formulaire de réservation

Maintenant que le module complémentaire Géolocalisation est actif, il est temps de créer le formulaire de réservation réel. Allez dans WPForms » Ajouter nouveau dans votre tableau de bord WordPress pour ouvrir le constructeur de formulaires.

Vous verrez quelques options ici. Si vous souhaitez gagner du temps, vous pouvez choisir parmi nos plus de 2 100 modèles de formulaires WordPress, comme le modèle de formulaire de réservation de rendez-vous, et cliquer sur Utiliser le modèle.

Ces modèles incluent déjà des champs de réservation courants, vous n'avez donc pas à partir de zéro. Cependant, si vous préférez construire à partir de zéro, choisissez plutôt Formulaire vierge.

Une autre option si vous ne souhaitez pas configurer manuellement chaque champ mais que vous avez des exigences personnalisées est de laisser le générateur de formulaires IA de WPForms s’en charger pour vous.

Survolez simplement le bouton violet Générer avec l'IA et cliquez sur Générer le formulaire. Vous arriverez à l’écran du générateur de formulaires IA. C’est ici que vous décrivez le type de formulaire que vous souhaitez.

Vous pouvez taper votre propre invite ou choisir parmi les suggestions à gauche. Une fois que vous appuyez sur générer, l’IA prend quelques secondes pour créer votre formulaire.

À partir de là, vous pouvez modifier la disposition du formulaire, ajouter/supprimer de nouveaux champs et apporter d'autres personnalisations. Une fois que votre formulaire vous convient, appuyez simplement sur le bouton Enregistrer.

Étape 4 : Ajouter le champ Carte à votre formulaire

Voici maintenant la partie amusante : l'ajout de la carte interactive pour que les visiteurs puissent voir tous vos sites en un coup d'œil et en choisir un qui leur convient le mieux.

Dans le générateur de formulaires, faites défiler vers le bas jusqu'à la section Champs sophistiqués sur le côté gauche. Vous y verrez le champ Carte. Faites-le glisser dans l'aperçu de votre formulaire sur la droite.

Je place généralement la carte près du haut du formulaire pour que les gens voient leurs options immédiatement, mais vous pouvez la positionner où vous voulez pour votre flux.

Une fois le champ Carte en place, cliquez dessus pour ouvrir le panneau Options du champ sur la gauche. Faites défiler vers le bas jusqu'à la section Emplacements. C'est ici que vous ajouterez tous vos bureaux, centres de service ou lieux de rendez-vous.

Dans le champ Adresse, commencez à taper l'adresse de votre premier emplacement. Pendant que vous tapez, des suggestions de saisie semi-automatique apparaîtront. Cliquez sur la bonne pour la sélectionner. Cela garantit que l'emplacement est épinglé avec précision sur la carte.

Ensuite, donnez un Nom personnalisé à cet emplacement. Quelque chose comme « Bureau du centre-ville » ou « Centre de service principal » convient bien. Ce nom apparaîtra lorsque les visiteurs cliqueront sur le marqueur de la carte, alors rendez-le clair et reconnaissable.

Vous pouvez également ajouter une Description si vous souhaitez inclure des détails supplémentaires tels que les heures d'ouverture, les informations de contact ou des notes spéciales. J'ai trouvé cela utile lorsque les emplacements ont des services ou des horaires différents.

Pour ajouter d'autres emplacements, cliquez sur l'icône plus (+) juste en dessous de votre premier emplacement. Un nouvel ensemble de champs apparaîtra. Répétez le même processus : tapez l'adresse, sélectionnez-la dans la saisie semi-automatique, ajoutez un nom et remplissez la description si nécessaire.

Continuez d'ajouter des emplacements jusqu'à ce que vous ayez inclus tous les bureaux ou centres de service que vous souhaitez sur la carte. Il n'y a pas de limite stricte ici, donc si vous avez cinq emplacements ou quinze, vous pouvez tous les ajouter.

Une fois que vous avez terminé, votre carte affichera automatiquement tous les emplacements avec des marqueurs individuels. Les visiteurs pourront cliquer sur chacun d'eux pour voir le nom et la description que vous avez ajoutés.

Personnaliser les marqueurs de carte pour chaque emplacement

Maintenant que vous avez ajouté vos emplacements, vous pouvez faire ressortir chacun d'eux en personnalisant les marqueurs de carte. C'est ici que vous pouvez ajouter de la personnalité à votre carte et aider les visiteurs à distinguer vos emplacements d'un coup d'œil.

Dans la section Emplacements sous Options du champ, vous remarquerez un menu déroulant Icône à côté de chaque emplacement que vous avez ajouté. Cliquez sur le menu déroulant et vous verrez deux choix : Icône ou Image.

Si vous choisissez Icône, vous pouvez choisir parmi des centaines d'icônes Font Awesome. Je choisis généralement des marqueurs simples comme des épingles de carte ou des icônes de bâtiment, mais vous avez des options comme des tasses à café, des hôpitaux ou des mallettes si vous cherchez quelque chose de plus spécifique.

Juste à côté du champ icône, vous verrez un sélecteur de couleur. Cliquez dessus pour changer la couleur du marqueur. Je trouve cela particulièrement utile lorsque vous avez différents types d'emplacements. Par exemple, vous pourriez utiliser le bleu pour les bureaux, le vert pour les magasins de détail et le rouge pour les lieux d'événements.

Si vous préférez utiliser votre propre image, sélectionnez Image et téléchargez un marqueur personnalisé. Cela fonctionne très bien si vous souhaitez correspondre à votre marque ou utiliser quelque chose qui représente vraiment votre entreprise.

Vous pouvez également ajuster la taille du marqueur à l'aide du menu déroulant Taille. Je règle généralement les miens sur Moyen ou Grand afin qu'ils soient faciles à repérer sur la carte, surtout si vous affichez de nombreux emplacements à la fois.

Une fois que vous avez personnalisé tous vos marqueurs, votre carte aura un aspect soigné et sera facile à naviguer. Les visiteurs pourront voir exactement où se trouve chaque emplacement et quel type de service ou d'installation il représente.

Activer la sélection d'emplacement pour les réservations

Maintenant que vous avez configuré votre carte avec plusieurs emplacements, il est temps de rendre ces emplacements sélectionnables afin que les visiteurs puissent réellement choisir où ils souhaitent réserver.

Dans le panneau des options du champ Carte, recherchez le bouton Afficher la liste des emplacements et activez-le. Cela affiche toutes les adresses de vos emplacements dans une liste soignée juste en dessous de la carte elle-même.

Vous remarquerez immédiatement quelque chose d'utile qui apparaît en dessous : l'option Autoriser la sélection d'emplacement. (Ceci n'apparaît qu'une fois que vous avez ajouté deux emplacements ou plus à votre carte.) Allez-y et activez-la également.

Après avoir apporté ces modifications, voici ce qui se passe sur le front-end. Des boutons radio apparaissent maintenant à côté de chaque emplacement dans la liste sous votre carte.

Les visiteurs peuvent cliquer sur n'importe quel emplacement pour le sélectionner comme lieu de réservation préféré. La carte se met à jour pour mettre en évidence leur choix, rendant ainsi parfaitement clair où ils se rendront.

Maintenant, lorsque quelqu'un soumet le formulaire, l'emplacement sélectionné est capturé avec tous les autres détails de la réservation. Vous verrez exactement quel bureau, centre de services ou lieu ils ont choisi.

Configurer les paramètres d'affichage de la carte

Affiner maintenant l'apparence et le comportement de votre carte. Cette étape vous permet de contrôler les contrôles de carte qui apparaissent et comment les visiteurs peuvent interagir avec elle.

Pour commencer, cliquez sur l'onglet Avancé dans les options du champ Carte. C'est là que vous pouvez vraiment affiner l'expérience. Sous Paramètres de présentation, vous verrez des bascules pour différents contrôles de carte.

Si vous souhaitez une interface plus épurée, vous pouvez masquer des éléments tels que les contrôles Plein écran, Type de carte ou Vue Street View. Ensuite, faites défiler vers Paramètres interactifs. C'est là que vous décidez du contrôle que les visiteurs ont sur la carte elle-même.

Si vous souhaitez garder les choses simples et éviter le défilement ou le glissement accidentels, vous pouvez désactiver Glisser ou Faire défiler pour zoomer. J'ai trouvé cela utile pour les formulaires où vous ne voulez pas que les gens soient distraits par le panoramique.

Avant de continuer, assurez-vous d’activer Afficher la miniature dans l’entrée. Cela ajoute un aperçu de carte miniature à vos entrées de formulaire dans le tableau de bord WordPress, ce qui facilite grandement la visualisation de l’emplacement sélectionné par une personne sans avoir à ouvrir l’entrée complète.

Étape 5 : Configurer les notifications et les confirmations

Une fois votre formulaire de réservation multi-sites prêt, prenez quelques minutes pour configurer les notifications et les confirmations avant de le mettre en ligne. Commencez par vous rendre dans Paramètres » Notifications dans le constructeur de formulaires.

Par défaut, WPForms envoie une notification à l’e-mail de votre administrateur WordPress chaque fois que quelqu’un soumet le formulaire. Vous pouvez modifier les paramètres de notification par défaut, tels que la ligne d’objet, ou changer les e-mails des destinataires si nécessaire à partir d’ici.

Si vous utilisez les balises intelligentes, vous pouvez également notifier l’adresse e-mail de l’utilisateur lorsqu’il soumet un formulaire, lui faisant savoir que nous l’avons reçu et que nous le contacterons sous peu.

Ceci est particulièrement vrai pour les formulaires multi-sites dans WordPress. Pour obtenir de l’aide à cette étape, consultez notre documentation sur la configuration des notifications de formulaire dans WordPress.

Une fois terminé, naviguez simplement vers Confirmations dans le menu Paramètres pour configurer les réponses aux soumissions de formulaire réussies. Vous avez trois options ici :

• Message : Affiche un simple message de remerciement directement sur la même page. Je l’utilise lorsque je veux que les choses restent rapides et simples.
• Afficher la page : Redirige les visiteurs vers une page spécifique de votre site, comme une page de confirmation détaillée avec les prochaines étapes ou les informations de contact.
• Accéder à l’URL (Redirection) : Les envoie vers une URL externe, utile si vous utilisez un système de réservation tiers ou une page de destination personnalisée.

Choisissez celle qui convient le mieux à votre flux de travail. Si vous optez pour l’option message, vous pouvez modifier le texte par défaut pour quelque chose de plus spécifique, comme : « Merci de réserver chez nous ! Nous enverrons un e-mail de confirmation à l’adresse que vous avez fournie sous peu. »

Pour obtenir de l’aide sur d’autres types de confirmation, consultez notre documentation sur la configuration des confirmations de formulaire.

Étape 6 : Publier votre formulaire de réservation multi-sites

Une fois votre formulaire de réservation multi-sites prêt, il est temps de le placer sur votre site où les visiteurs peuvent réellement l’utiliser. WPForms vous permet d’ajouter vos formulaires à plusieurs endroits sur votre site Web, y compris vos pages, vos articles de blog et les widgets de barre latérale.

Cliquez sur le bouton Intégrer en haut du constructeur de formulaires. Une fenêtre contextuelle apparaîtra avec deux options : vous pouvez soit créer une nouvelle page, soit ajouter le formulaire à une page existante.

Si vous créez une page de réservation dédiée, cliquez sur Créer une nouvelle page. Donnez un titre à votre page comme « Réserver un rendez-vous » ou « Planifier une visite », puis cliquez sur C’est parti !

WPForms ouvrira l’éditeur de blocs WordPress avec votre formulaire déjà intégré. À partir de là, vous pouvez ajouter du texte d’introduction au-dessus du formulaire, ajuster la mise en page de la page ou styliser un peu votre formulaire.

Cliquez simplement sur la zone autour du formulaire intégré dans l'éditeur de page pour ouvrir un nouveau panneau sur la droite. Ici, vous trouverez toutes les options de style de base et avancées pour WPForms.

Pour styliser rapidement votre formulaire, vous pouvez sélectionner un thème prédéfini dans la section Thème du formulaire. Dans cet exemple, j’utilise le thème Tranquil (qui est l’un de mes préférés).

N’hésitez pas à essayer d’autres thèmes ; vous avez beaucoup d’options. Si vous aimez expérimenter directement, vous pouvez également personnaliser manuellement différents éléments du formulaire plus précisément.

Si la carte vous convient et que les champs du formulaire fonctionnent comme prévu, vous pouvez Publier la page. Votre formulaire de réservation multi-sites est maintenant en ligne et prêt à collecter des rendez-vous.

FAQ sur la création d’un formulaire de réservation multi-sites WordPress

Si vous configurez un formulaire de réservation multi-sites dans WordPress, vous avez probablement quelques questions. J’ai répondu aux plus courantes ci-dessous pour vous aider à tout faire fonctionner sans problème.

Qu’est-ce qu’un formulaire de réservation multi-sites dans WordPress ?

Un formulaire de réservation multi-sites permet aux visiteurs de choisir parmi plusieurs lieux physiques lors de la planification d’un rendez-vous ou d’une réservation. Au lieu de créer des formulaires distincts pour chaque bureau ou lieu, vous pouvez utiliser un seul formulaire avec une carte interactive qui affiche tous vos lieux à la fois.

C’est particulièrement utile si vous gérez une entreprise avec plusieurs centres de services, espaces événementiels ou lieux de rendez-vous. Les visiteurs peuvent voir où se trouve chaque lieu, choisir celui qui leur convient le mieux et réserver sur place.

Comment le champ Carte aide-t-il pour les formulaires de réservation ?

Le champ Carte de WPForms affiche tous vos lieux sur une carte interactive dans votre formulaire. Les visiteurs peuvent zoomer, déplacer et cliquer sur les marqueurs pour voir les détails de chaque lieu.

Une fois qu’ils ont sélectionné un lieu, ce choix est capturé dans la soumission du formulaire. Vous pouvez l’utiliser pour acheminer les réservations vers la bonne équipe, envoyer des e-mails de confirmation spécifiques au lieu, ou simplement pour organiser vos dossiers.

Puis-je personnaliser les marqueurs de carte pour chaque lieu ?

Oui, vous le pouvez. Lorsque vous ajoutez des lieux à votre champ Carte, chacun obtient son propre marqueur sur la carte.

Vous pouvez personnaliser le titre, l’adresse et la description de chaque marqueur. Cela aide les visiteurs à comprendre ce qui rend chaque lieu différent (comme la disponibilité du parking, les horaires ou les services proposés).

Puis-je envoyer différentes notifications en fonction du lieu sélectionné ?

Absolument. Vous pouvez configurer une logique conditionnelle dans les paramètres de notification de votre formulaire pour envoyer différents e-mails en fonction du lieu choisi par le visiteur.

Par exemple, si quelqu’un réserve à votre bureau du centre-ville, la notification est envoyée à votre équipe du centre-ville. S’il choisit le lieu d’en haut, elle est acheminée vers cette équipe à la place.

Les clients peuvent-ils sélectionner plusieurs lieux en une seule réservation ?

Pas avec un seul champ Carte. Le champ Carte est conçu pour que les visiteurs choisissent un lieu par soumission. Si votre modèle économique nécessite de réserver plusieurs lieux à la fois, vous devrez utiliser des champs Liste déroulante ou Boutons radio distincts pour chaque sélection.

Le champ Carte fonctionne-t-il sur les appareils mobiles ?

Oui, il fonctionne très bien sur mobile. La carte est entièrement réactive, de sorte que les visiteurs peuvent la toucher, zoomer et interagir avec elle, tout comme ils le feraient sur un ordinateur de bureau.

Je l'ai testé sur téléphones et tablettes, et l'expérience reste fluide. Vos visiteurs n'auront aucune difficulté à choisir un lieu, quel que soit l'appareil qu'ils utilisent.

Puis-je utiliser le champ Carte avec les formulaires de paiement ?

Oui, vous le pouvez. Le champ Carte fonctionne avec les champs de paiement tels que Stripe ou PayPal Commerce.

Si vous facturez des montants différents en fonction de la localisation, vous pouvez utiliser la logique conditionnelle pour ajuster le total.

Par exemple, les rendez-vous dans un lieu peuvent coûter plus cher en raison d'installations premium ou de temps de service plus longs.

Ensuite, les fonctionnalités cachées de WPForms que vous ne connaissiez pas

WPForms regorge d'outils et d'options qui ne sont pas immédiatement évidents mais qui peuvent améliorer considérablement votre flux de travail et les formulaires que vous créez.

Consultez notre guide pour en savoir plus sur certains de ces joyaux cachés et fonctionnalités qui ont peut-être échappé à votre attention mais qui ont le potentiel de faire passer vos formulaires WordPress au niveau supérieur.

Créez votre formulaire WordPress maintenant

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 inclut de nombreux modèles gratuits et offre une garantie de remboursement de 14 jours.

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