-

Formulaire multi-étapes dans Drupal - Comment le créer de manière simple ?

Drupal est un outil puissant qui vous offre de nombreuses possibilités pour créer des applications web robustes. L'un des modules populaires pour ce système est Webform, qui vous permet de travailler avec des formulaires en ligne avancés. Dans cet article de blog, je vais vous montrer comment construire un formulaire en plusieurs étapes en quelques étapes simples - parfait pour s'inscrire à des événements ou collecter d'autres soumissions. Je vous invite à lire l'article ou à regarder  l'épisode de la série "Nowoczesny Drupal".

Qu'est-ce qu'un formulaire en plusieurs étapes et pourquoi l'utiliser ?

Un formulaire en plusieurs étapes est un type de formulaire qui divise les champs en étapes individuelles. Cela empêche le visiteur du site d'être submergé par la quantité d'informations qu'il doit entrer en une seule fois. Cela se traduit par une meilleure expérience utilisateur et un plus grand nombre de soumissions complètes.

Préparation d'un formulaire en plusieurs étapes dans Drupal

Créer un formulaire dans Drupal en utilisant le module Webform  est très rapide et facile. Dans un autre article, j'ai montré comment construire un formulaire de candidature sur un site web. Ci-dessous, je vais décrire en quelques étapes comment préparer un formulaire en plusieurs étapes. 

1. Sélection du modèle de formulaire en plusieurs étapes

La première étape pour construire un formulaire est d'utiliser un modèle prêt à l'emploi. Le module Webform offre diverses options qui peuvent être personnalisées pour répondre aux besoins du projet. Dans cet exemple, j'utilise le modèle "Inscription au cours". Après importation, vous obtiendrez un formulaire de base avec des champs prédéfinis.

Sélection du modèle dans le module Webform de Drupal pour construire un formulaire en plusieurs étapes avec inscription.

 

2. Ajout d'étapes dans le formulaire étendu

Ensuite, vous pouvez vous concentrer sur la construction d'un formulaire en plusieurs étapes.

  • Accédez à Build et ajoutez une page, qui représentera les étapes du formulaire. Il se composera de trois étapes.
  • Définissez les noms des étapes, par exemple :
    • Étape 1: Informations de base sur l'utilisateur.
    • Étape 2: Informations de contact.
    • Étape 3: Informations supplémentaires.
Vue de la configuration des étapes d'un formulaire en plusieurs étapes dans le panneau d'administration de Drupal.

 

3. Attribution des champs aux étapes du formulaire en plusieurs étapes

À ce stade, organisez les questions selon les catégories pertinentes.

  • Faites glisser les blocs vers les pages appropriées :
    • "Vos informations personnelles" → "Informations de base sur l'utilisateur".
    • "Liste de diffusion" → "Informations de contact".
    • "Informations supplémentaires" → "Autres informations".
Organisation d'un formulaire en plusieurs étapes dans Drupal avec personnalisation des questions dans les champs appropriés.

 

4. Ajustement de la barre de progression

Vous pouvez personnaliser l'apparence de la barre de progression pour l'adapter à vos besoins.

  • Dans les paramètres du formulaire, activez la barre de progression ( paramètres de progression).
  • Vous pouvez choisir un style :
    • Pourcentage (par exemple, "33% complété").
    • Numéroté (par exemple, "Page 1 sur 3").
  • De plus, vous pouvez activer l'option de navigation entre les étapes, qui permet à l'utilisateur de revenir facilement aux sections précédentes.
Configuration d'une barre de progression pour un formulaire en plusieurs étapes dans Drupal avec des informations visibles pour l'utilisateur.

  

5. Test d'un formulaire en plusieurs étapes

Maintenant, vous devriez vérifier votre formulaire :

  • Passez par le formulaire en ligne, en remplissant les champs à chaque étape.
  • Vérifiez la justesse de la barre de progression et la navigation entre les étapes.

6. Personnalisation du formulaire

En personnalisant le tableau du formulaire dans le module Webform de Drupal, vous pouvez adapter la vue des soumissions à vos objectifs. Vous pouvez masquer les champs inutiles, tels que l'adresse, et ne laisser que ceux clés, tels que le numéro de téléphone.

De plus, vous avez la possibilité de définir différentes vues, permettant à chaque personne d'adapter le tableau à ses préférences. Cette fonctionnalité est particulièrement utile dans les équipes, où diverses personnes ont besoin de différentes données d'un seul coup d'œil.

Vous pouvez également enregistrer une vue personnalisée ou en définir une par défaut pour tout le monde, offrant flexibilité et commodité dans le travail avec les données.

Vue d'une fenêtre avec personnalisation d'un formulaire en plusieurs étapes dans le module Webform de Drupal.

 

Comme vous pouvez le voir, créer un formulaire en plusieurs étapes dans Drupal avec une option de personnalisation est rapide et efficace. En quelques étapes simples, vous pouvez grandement améliorer l'expérience utilisateur, peu importe où vous placez le formulaire sur votre site web.

Automatisation des formulaires dans Drupal

L'automatisation des formulaires dans le module Webform de Drupal vous permet de gérer efficacement les demandes et les données des utilisateurs. Avec la fonction d'auto-nettoyage, vous pouvez supprimer les soumissions plus anciennes ou les données avec un certain statut, ce qui aide à garder le système propre et minimise le stockage d'informations sensibles.

Si vous souhaitez limiter le stockage des données sensibles :

  1. Accédez à Paramètres des soumissions .
  2. Activez le nettoyage automatique, comme la suppression des demandes de plus d'un jour.
  3. En utilisant des modules supplémentaires pour Drupal, vous pouvez configurer la suppression des données même à des intervalles de quelques minutes.
 Vue des paramètres d'automatisation pour un formulaire en plusieurs étapes dans Drupal avec une option de suppression des soumissions.

 

Cette configuration est particulièrement utile lorsque les données sont envoyées à des systèmes externes, tels que des plateformes d'automatisation du marketing et de marketing comme HubSpot ou MailChimp.

Création de modèles de formulaires en plusieurs étapes

Le module Webform vous permet d'enregistrer le formulaire prêt à l'emploi comme modèle. Cela vous permet de l'utiliser facilement à l'avenir pour d'autres projets :

  1. Dans l'onglet des paramètres, cochez l'option "Utiliser comme modèle".
  2. Vous pouvez construire de nouveaux formulaires à partir de celui-ci, en modifiant les champs selon les besoins.
Configuration du modèle pour un formulaire en plusieurs étapes dans Drupal afin de le reproduire dans des projets ultérieurs.

 

Fonctionnalités supplémentaires du module Webform

  1. Champs avancés et validation
    Vous pouvez définir des conditions pour afficher des champs, utiliser des champs conditionnels et une validation avancée.
  2. Intégrations avec des outils externes
    Les données du formulaire peuvent être envoyées automatiquement vers des systèmes CRM.
  3. Configuration utilisateur étendue
    Webform permet la personnalisation des vues des formulaires et des tickets pour les utilisateurs individuels. Chaque membre de l'équipe peut définir ses propres paramètres.

Les formulaires en plusieurs étapes dans Drupal - résumé

La création de formulaires en plusieurs étapes dans Drupal avec le module Webform est simple et intuitive. Avec des modèles prêts à l'emploi, des options de personnalisation et des fonctionnalités avancées, vous pouvez rapidement ajuster le formulaire pour répondre aux objectifs de votre organisation. Il est également important de se rappeler des options d'automatisation, qui facilitent la gestion de vos données et gardent votre système organisé.

Drupal et le module Webform sont des outils qui vous permettent de garder un contrôle total sur vos formulaires tout en offrant un confort d'utilisation. Cependant, si vous avez besoin d'aide pour les configurer ou les placer sur votre site web, obtenez le soutien de spécialistes expérimentés d'une agence Drupal

-