Présentation

La fonction des formulaires adaptatifs d’Adobe Experience Manager (AEM) permet de créer des formulaires adaptatifs attrayants et réactifs, rendus au format PDF ou HTML5 en fonction des paramètres du périphérique et du navigateur. Comme leur nom l’indique, les formulaires adaptatifs s’adaptent dynamiquement aux réponses des utilisateurs en ajoutant ou en supprimant des champs ou des sections.

Il est ainsi possible de ventiler un formulaire dans des sections logiques, ce qui permet aux utilisateurs finaux de se concentrer sur le remplissage d’une section à la fois. Vous pouvez, en outre, tirer parti des modèles de formulaire par défaut fournis avec les formulaires AEM, utiliser des modèles Adobe XML ou XFA existants, ou encore créer vos propres modèles de toutes pièces.

Remarque :

La création de formulaires adaptatifs n’est pas prise en charge en mode tactile. Par conséquent, si l’URL contient /editor.html/, vous devez la remplacer par /cf#/, ce qui a pour effet d’appliquer le mode de création classique.

Interface de création de formulaires adaptatifs

L’interface intuitive, la fonction de glisser-déposer, les composants standard de formulaire et le référentiel intégré de ressources permettent de créer facilement et rapidement des formulaires adaptatifs.

Lorsque vous créez un formulaire adaptatif ou en modifiez un existant, vous utilisez les éléments suivants de l’interface utilisateur :

  • Outil de recherche de contenu
  • Page de formulaires adaptatifs
  • Sidekick
Interface de création de formulaires adaptatifs
A. Outil de recherche de contenu  B. Page de formulaires adaptatifs C. Sidekick 

Outil de recherche de contenu

Le volet Outil de recherche de contenu vous permet de rechercher, d’afficher et d’utiliser des ressources dans votre référentiel de gestion des actifs numériques AEM. Il se compose de plusieurs onglets qui isolent différents types de contenu, tels que des images, des documents, des pages, des séquences vidéo, etc. Pour plus d’informations sur la recherche de ressources dans la gestion des actifs numériques, reportez-vous à la section Recherche et affichage de ressources numériques.

Cependant, dans le cas d’un formulaire adaptatif qui utilise un schéma XML ou un gabarit de formulaire XDP comme modèle de formulaire, un nouvel onglet présentant la hiérarchie des modèles de formulaire s’affiche dans l’outil de recherche de contenu. Il vous permet de faire glisser des éléments du modèle de formulaire sur le formulaire adaptatif. Les éléments ajoutés sont automatiquement convertis en composants de formulaire, tout en conservant leurs propriétés d’origine.

Page de formulaires adaptatifs

La page de formulaires adaptatifs est le formulaire proprement dit. Elle est identique à toute autre page de gestion de contenu Web modélisée en tant que composant de gestion de contenu Web cq:Page. L’illustration suivante présente la structure de contenu d’un formulaire adaptatif standard.

Structure de contenu d’une page de gestion de contenu Web de formulaires adaptatifs

La structure de contenu contient généralement les composants principaux ci-dessous :

  • guideContainer : racine d’un formulaire adaptatif, indiquée sous la forme Début du formulaire adaptatif dans l’interface utilisateur du formulaire. Dans ce composant, vous pouvez spécifier les éléments suivants :
    • Mise en page du formulaire adaptatif pour mobiles : définit l’apparence du formulaire sur les appareils mobiles.
    • Page de remerciement : définit la page vers laquelle l’utilisateur est redirigé après l’envoi du formulaire.
    • Action d’envoi : définit la manière dont le formulaire est traité sur le serveur lorsque l’utilisateur l’envoie.
    • Style : indique le chemin d’accès au fichier CSS utilisé pour personnaliser l’apparence du formulaire.
  •  rootPanel : panneau racine d’un formulaire adaptatif. Il peut contenir des sous-panneaux sous le nœud d’éléments. Une mise en page peut être associée à chaque panneau qui comprend le panneau racine. La mise en page du panneau détermine la disposition du formulaire. Par exemple, dans la mise en page en accordéon, les éléments constitutifs sont disposés sous la forme d’étapes en accordéon.
  • barre d’outils : une barre d’outils globale est associée à un conteneur de formulaires adaptatifs. Il s’agit d’une barre d’outils à l’échelle du formulaire. Cette barre d’outils peut être ajoutée à l’aide de l’action Ajouter une barre d’outils de la barre d’édition, ce qui permet aux auteurs d’ajouter des actions telles que Envoyer, Enregistrer, réinitialiser, etc. 
  • ressources : ce nœud contient des informations supplémentaires au sujet de la création de formulaires. Il s’agit, par exemple, de détails sur le modèle de formulaire, de détails de localisation, etc.

Sidekick

Le Sidekick comprend des composants que vous pouvez utiliser pour créer un formulaire adaptatif. Vous pouvez faire glisser des composants sur le formulaire adaptatif afin d’ajouter des éléments de formulaire, puis configurer les éléments ajoutés conformément aux exigences. Le tableau ci-dessous décrit les composants répertoriés dans la catégorie Formulaire adaptatif du Sidekick.

ComposantFonctionnalité
BoutonAjoute un bouton que vous pouvez configurer afin d’effectuer des actions telles que Enregistrer, Réinitialiser, Passer au suivant, Revenir au précédent, etc.
Case à cocherAjoute une case à cocher.
Sélecteur de dateAjoute un champ de calendrier pour sélectionner une date.
Liste déroulanteAjoute une liste déroulante, à sélection simple ou multiple.
E-sign

Ajoute une zone de signature dans laquelle les utilisateurs peuvent signer le formulaire. Ce composant permet de configurer Adobe EchoSign ou des services de signature tactile.

Dans le cas des formulaires adaptatifs qui utilisent le modèle Formulaire XDP, le composant E-Sign affiche le modèle de formulaire d’origine associé au formulaire adaptatif.  

Pièce jointeAjoute un bouton qui permet aux utilisateurs de rechercher et de joindre des documents annexes au formulaire.
ImagePermet d’insérer une image.
Zone numériqueAjoute un champ destiné à la saisie de valeurs numériques.
PanneauAjoute un panneau ou un sous-panneau.
Zone de mot de passeAjoute un champ destiné à la saisie d’un mot de passe.
Bouton radioAjoute des cases d’option.
Bouton RéinitialiserAjoute un bouton permettant de réinitialiser des champs de formulaire.
Signature tactileAjoute un champ destiné à la saisie de signatures tactiles.
Texte statiquePermet de spécifier du texte statique.
Bouton EnvoiAjoute un bouton d’envoi permettant d’envoyer le formulaire à l’action d’envoi configurée.
RésuméAjoute un texte récapitulatif spécifié par les auteurs. Ce texte s’affiche après l’envoi du formulaire.
Terms and conditions (Conditions générales)
Ajoute un champ que les auteurs peuvent utiliser pour spécifier les conditions générales que les utilisateurs doivent consulter avant de remplir le formulaire.
Zone de texte  Ajoute une zone de texte dans laquelle un utilisateur peut spécifier les informations nécessaires.
VérifierDans le cas des formulaires adaptatifs qui utilisent le modèle Formulaire XDP, le composant Verify (Vérifier) effectue le rendu du formulaire pour permettre aux utilisateurs de vérifier les informations.

Remarque :

Vous pouvez également ajouter un composant de panneau à partir de la barre d’outils du panneau parent à l’aide du bouton Add Child Panel (Ajouter un panneau enfant). De même, vous pouvez ajouter une barre d’outils spécifique au panneau à l’aide du bouton Ajouter une barre d’outils. Cette barre d’outils peut être configurée pour être affichée dans la partie supérieure ou inférieure du panneau à l’aide de la boîte de dialogue Modifier le panneau.

Chaque composant est associé à des propriétés qui contrôlent son apparence et ses fonctionnalités. Pour configurer les propriétés d’un composant, cliquez sur celui-ci avec le bouton droit de la souris et sélectionnez ensuite Modifier pour ouvrir la boîte de dialogue d’édition correspondante.

Remarque :

Le Sidekick propose d’autres onglets, tels que Propriétés de page et Processus. Il est toutefois recommandé de ne pas utiliser d’autres onglets et de s’en tenir à l’interface utilisateur des formulaires AEM pour la gestion de ces formulaires. Vous devez, par exemple, utiliser l’interface des formulaires AEM pour publier des formulaires, plutôt que l’onglet Propriétés de page destiné à la publication.

Prévisualisation d’un formulaire

Vous pouvez prévisualiser un formulaire adaptatif pendant sa création. Cela vous permet de le voir tel qu’il sera présenté à l’utilisateur final et de le modifier en conséquence. Pour prévisualiser un formulaire, cliquez sur au bas du Sidekick. Cliquez sur pour revenir au mode d’édition.

Remarque :

Vous pouvez afficher un aperçu de votre formulaire tel qu’il sera rendu sur un éventail de périphériques. Pour ce faire, sélectionnez le périphérique approprié dans la liste déroulante Périphériques qui s’affiche sous le Sidekick lors de la prévisualisation d’un formulaire.

Prévisualisation de formulaires adaptatifs sur différents périphériques

Ce produit est distribué sous licence Creative Commons Attribution - Pas d’utilisation commerciale - Partage à l’identique 3.0 non transposé  Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.

Mentions légales   |   Politique de confidentialité en ligne