Guide de prise en main du créateur de formulaires creating-an-adaptive-form

Version
Lien de l’article
AEM 6.5
Cliquez ici
AEM as a Cloud Service
Cet article

Le créateur de formulaires d’AEM Forms vous permet de créer des formulaires attrayants, réactifs, dynamiques et adaptatifs. Que vous soyez un créateur de formulaires qui crée des formulaires professionnels ou que vous ayez besoin de créer rapidement des formulaires réactifs, AEM Forms fournit un assistant convivial. L’assistant offre une navigation rapide par onglets pour sélectionner facilement des modèles, un style, des champs et des options d’envoi préconfigurés.

Assistant de création d’un formulaire adaptatif {align="center" width="100%"}

Avant de commencer, découvrez les types de composants de formulaires disponibles :

  • Composants principaux de formulaires adaptatifs : il s’agit de composants de capture de données normalisés. Ces composants offrent des fonctionnalités de personnalisation, un délai de développement réduit et de plus bas coûts de maintenance pour vos expériences d’inscription numérique. Un développeur ou une développeuse peut facilement personnaliser et mettre en forme ces composants. Vous pouvez consulter https://aemcomponents.dev/ pour afficher les composants principaux disponibles en action Adobe recommande d’utiliser ces composants modernes et extensibles pour développer des formulaires adaptatifs.

  • Composants de base des formulaires adaptatifs : il s’agit de composants de capture de données classiques (anciens). Vous pouvez continuer à les utiliser pour modifier votre formulaire adaptatif existant basé sur les composants de base. Si vous créez des formulaires, Adobe recommande d’utiliser les composants principaux de formulaires adaptatifs pour créer des formulaires adaptatifs.

Création d’un Forms adaptatif avec des composants principaux (recommandé)

Pour créer un formulaire adaptatif, vous devez disposer des éléments suivants :

  • Activer les composants principaux de Forms adaptative pour votre environnement : lorsque vous créez un programme, les composants principaux de Forms adaptative sont déjà activés pour votre environnement. Installez la dernière version de pour activer les composants principaux de Forms adaptatif pour votre environnement AEM Cloud Service. Lors de l’activation des composants principaux pour votre environnement, le modèle Formulaires adaptatifs (composant principal) et le thème de la zone de travail sont ajoutés à votre environnement. Si votre version du SDK AEM est antérieure à 2023.02.0, assurez-vous que l’indicateur prerelease est activé dans votre environnement, car les composants principaux des formulaires adaptatifs faisaient partie de la version préliminaire avant la version 2023.02.0.

  • Modèle de formulaire adaptatif  : un modèle fournit une structure de base et définit l’aspect, c’est-à-dire la mise en page et les styles, d’un formulaire adaptatif. Il comporte des composants pré-formatés contenant certaines propriétés et une certaine structure de contenu. Il fournit également les options permettant de définir un thème et une action d’envoi. Le thème définit l’aspect et l’action d’envoi définit l’action à entreprendre lors de l’envoi d’un formulaire adaptatif. Par exemple, l’envoi des données collectées à une source de données. Le service cloud fournit un modèle prêt à l’emploi, sans nom :

    • Le modèle blank est inclus dans chaque nouveau programme AEM Forms as a Cloud Service.
    • Vous pouvez installer le package de référence, via le gestionnaire de modules, pour ajouter le modèle blank à votre programme AEM Forms as a Cloud Service.
    • Vous pouvez également créer un modèle de Forms adaptatif (composants principaux) à partir de zéro.
  • Un thème de formulaire adaptatif  : un thème contient des détails de style pour les composants et les panneaux. Ces styles incluent les propriétés telles que les couleurs d’arrière-plan, les couleurs d’état, la transparence, l’alignement et la taille. Lorsque vous appliquez un thème, le style spécifié se reflète sur les composants correspondants. Le modèle Canvas est inclus dans chaque nouveau programme AEM Forms as a Cloud Service.

  • Autorisations  : ajoutez vos utilisateurs et utilisatrices au groupe forms-users. Les membres du groupe forms-users ont les autorisations de créer un formulaire adaptatif. Pour obtenir une liste détaillée des groupes d’utilisateurs et d’utilisatrices spécifiques aux formulaires, voir Groupes et autorisations.

Créer un formulaire adaptatif create-an-adaptive-form-core-components

  1. Connectez-vous à votre instance d’auteur Experience Manager Forms. Il peut s’agir d’une instance cloud ou d’une instance de développement local.

  2. Entrez vos informations d’identification dans la page de connexion d’Experience Manager. Une fois connecté, dans le coin supérieur gauche, sélectionnez Adobe Experience Manager > Formulaires > Formulaires et documents..

  3. Sélectionnez Créer  > Formulaires adaptatifs. Cette action permet d’ouvrir l’assistant. Dans l’onglet Source, sélectionnez un modèle :

    Modèle de composants principaux {align="center" width="100%"}

    Lorsque vous sélectionnez un modèle, un thème et l’action d’envoi spécifiée dans le modèle sont sélectionnés automatiquement. Le bouton Créer est activé. Vous pouvez accéder aux onglets Style ou Envoi pour sélectionner un autre thème ou une autre action d’envoi. Si le modèle sélectionné ne spécifie pas de thème, le bouton de création reste désactivé. Vous pouvez accéder à l’onglet Styles pour sélectionner manuellement un thème.

    note note
    NOTE
    Si vous n’avez pas le modèle Formulaires adaptatifs (composant principal) sur votre environnement, vous devez activer les composants principaux des formulaires adaptatifs pour votre environnement. Quand vous activez des composants principaux pour votre environnement, le modèle Formulaires adaptatifs (composant principal) est ajouté à votre environnement.
  4. Dans l’onglet Style, sélectionnez un thème :

    • Lorsque le modèle sélectionné spécifie un thème, celui-ci est automatiquement sélectionné dans l’assistant. Vous pouvez également choisir un thème différent dans l’onglet Style.

    • Si le modèle sélectionné ne spécifie aucun thème, vous pouvez utiliser l’onglet Style pour en choisir un. Le bouton Créer n’est activé qu’après la sélection d’un thème.

  5. (Facultatif) Dans l’onglet Données, sélectionnez un modèle de données :

    • Modèle de données de formulaire : un modèle de données de formulaire (FDM) vous permet d’intégrer des entités et des services provenant de sources de données disparates à un formulaire adaptatif. Choisissez le modèle de données de formulaire (FDM) si le formulaire adaptatif que vous créez implique l’extraction et l’écriture de données depuis et vers plusieurs sources de données.

    • Schéma JSON  : schéma JSON, notre formulaire adaptatif basé sur les composants principaux, permet une intégration transparente au système back-end de votre entreprise en vous permettant d’associer un schéma JSON, qui représente la structure des données générées ou consommées. Cette association permet aux créateurs et créatrices d’ajouter dynamiquement du contenu au formulaire adaptatif à l’aide des éléments du schéma. Les éléments du schéma sont facilement accessibles dans l’onglet Objets de modèle de données de l’explorateur de contenu au cours du processus de création. Tous les champs sont automatiquement ajoutés à tout formulaire adaptatif créé.

    Par défaut, tous les champs du schéma JSON associé sont automatiquement sélectionnés et convertis en composants de formulaire adaptatif correspondants, ce qui simplifie le processus de création. L’assistant vous permet, en outre, de sélectionner les champs à inclure dans le formulaire adaptatif au moyen de cases à cocher.

  6. Dans l’onglet Envoi, sélectionnez une action d’envoi :

    • Lorsque vous sélectionnez un modèle, l’action d’envoi spécifiée dans le modèle est sélectionnée automatiquement. Vous pouvez sélectionner une autre action d’envoi dans l’onglet Envoi. L’onglet Envoi affiche toutes les actions d’envoi disponibles.

    • Lorsque le modèle sélectionné ne spécifie aucune action d’envoi, vous pouvez utiliser l’onglet Envoi pour sélectionner une action d’envoi

  7. (Facultatif) Dans l’onglet Diffusion, vous pouvez spécifier une date de publication ou de d’annulation de publication pour un formulaire adaptatif.

  8. Sélectionnez Créer. Une boîte de dialogue pour spécifier le titre, le nom et l’emplacement d’enregistrement du formulaire adaptatif s’affiche :

    • Titre Spécifie le nom d’affichage du formulaire. Le titre vous permet d’identifier le formulaire dans l’interface utilisateur Experience Manager Forms d’AEM Forms.
    • Nom :  indique le nom du formulaire. Un nœud portant le nom spécifié est créé dans le référentiel. Lorsque vous commencez à saisir un titre, la valeur du champ Nom est automatiquement générée. Vous pouvez modifier la valeur suggérée. Le champ Nom ne peut contenir que des caractères alphanumériques, des traits d’union et des traits de soulignement. Toutes les entrées non valides sont remplacées par un trait d’union.
    • Chemin d’accès : indique l’emplacement d’enregistrement du formulaire adaptatif. Vous pouvez enregistrer le formulaire adaptatif directement sur /content/dam/formsanddocuments ou créer un dossier tel que /content/dam/formsanddocuments/adaptiveforms pour enregistrer un formulaire adaptatif. Assurez-vous de créer le dossier avant de l’utiliser dans le chemin d’accès. Le champ Chemin d’accès ne crée pas de dossier automatiquement.
  9. Sélectionnez Créer. Un formulaire adaptatif est créé et s’ouvre dans l’éditeur de formulaires adaptatifs. L’éditeur affiche le contenu disponible dans le modèle. En fonction du type de formulaire adaptatif, les éléments de formulaire présents dans le schéma JSON ou le modèle de données de formulaire (FDM) associé sont affichés dans l’onglet Objets de modèle de données de l’Explorateur de contenu dans la barre latérale.

Vous pouvez maintenant faire glisser et déposer les éléments Composants principaux de Forms adaptatif ou de schéma pour créer votre formulaire adaptatif.

Modification des propriétés du modèle de formulaire d’un formulaire adaptatif edit-form-model-core-components-based-adaptive-forms

  1. Sélectionnez le formulaire adaptatif et sélectionnez Informations sur la page > Ouvrir les propriétés. La page Propriétés du formulaire s’ouvre.

  2. Accédez à l’onglet Modèle de formulaire et choisissez un modèle de formulaire. Si le formulaire adaptatif ne dispose pas de modèle de formulaire, vous avez la possibilité de choisir un schéma JSON ou un modèle de données de formulaire (FDM). D’autre part, si le formulaire adaptatif est déjà basé sur un modèle de formulaire, vous avez la possibilité de passer à un autre modèle de formulaire du même type. Par exemple, si le formulaire utilise un schéma JSON, vous pouvez facilement passer à un autre schéma JSON. De même, si le formulaire utilise un modèle de données de formulaire (FDM), vous pouvez passer à un autre modèle de données de formulaire (FDM).

  3. Sélectionnez Enregistrer pour enregistrer les propriétés.

Créer un Forms adaptatif avec des composants de base

Pour créer un formulaire adaptatif, vous devez disposer des éléments suivants :

  • Autorisations  : ajoutez vos utilisateurs et utilisatrices à forms-users pour leur fournir les autorisations de création d’un formulaire adaptatif. Pour obtenir une liste détaillée des groupes d’utilisateurs et d’utilisatrices spécifiques aux formulaires, voir Groupes et autorisations.

  • Un thème de formulaire adaptatif  : un thème contient des détails de style pour les composants et les panneaux. Ces styles incluent les propriétés telles que les couleurs d’arrière-plan, les couleurs d’état, la transparence, l’alignement et la taille. Lorsque vous appliquez un thème, le style spécifié se reflète sur les composants correspondants. Vous pouvez ​ créer un thème ​ ou ​ importer un thème existant. Vous pouvez également déployer l’archétype le plus récent pour obtenir des exemples de thèmes.

  • Modèle de formulaire adaptatif  : un modèle fournit une structure de base et définit l’aspect, c’est-à-dire la mise en page et les styles, d’un formulaire adaptatif. Il comporte des composants pré-formatés contenant certaines propriétés et une certaine structure de contenu. Il fournit également les options permettant de définir un thème et une action d’envoi. Le thème définit l’aspect et l’action d’envoi définit l’action à entreprendre lors de l’envoi d’un formulaire adaptatif. Par exemple, l’envoi des données collectées à une source de données. Le service cloud prend en charge deux types de modèles :

    • Modèle modifiable : vous pouvez créer un ou importer un modèle modifiable existant. Vous pouvez également déployer l’archétype le plus récent pour obtenir des exemples de modèles modifiables.

    • Modèle statique  : il s’agit de modèles hérités qui ne sont recommandés que pour les clients effectuant la migration depuis des installations Adobe Managed Services (AMS) et AEM Forms On-Premise (AEM 6.5 Forms ou version antérieure). Ainsi, vous pouvez continuer à tirer profit de votre investissement existant dans les modèles statiques. Lorsque vous créez un formulaire adaptatif, utilisez un modèle modifiable.

Créer un formulaire adaptatif create-an-adaptive-form-foundation-components

  1. Accédez à l’instance de création Experience Manager Forms. Il peut s’agir d’une instance cloud ou d’une instance de développement local.

  2. Entrez vos informations d’identification dans la page de connexion d’Experience Manager.

    Une fois connecté, dans le coin supérieur gauche, sélectionnez Adobe Experience Manager  > Formulaires  > Formulaires et documents.

  3. Sélectionnez Créer  > Formulaires adaptatifs. Cette action permet d’ouvrir l’assistant.

  4. Dans l’onglet Source, sélectionnez un modèle :

    • La sélection d’un modèle modifiable sélectionne automatiquement un thème et une action d’envoi spécifiés dans le modèle, et le bouton Créer est activé. Vous pouvez accéder aux onglets Style ou Envoi pour sélectionner un autre thème ou une autre action d’envoi. Si le modèle modifiable sélectionné ne spécifie pas de thème, le bouton de création reste désactivé. Vous pouvez accéder à l’onglet Styles pour sélectionner manuellement un thème.

      note note
      NOTE
      Vous pouvez également créer un modèle de document d’enregistrement à l’aide d’un éditeur de formulaires adaptatifs. Pour plus d’informations, voir Prise en charge des documents d’enregistrement dans l’éditeur de formulaires adaptatifs.
    • Lorsque vous sélectionnez un modèle statique, les options de données, de style, d’envoi, de diffusion et de prévisualisation ne sont pas disponibles. Lorsque vous créez un formulaire adaptatif, il est recommandé d’utiliser un modèle modifiable.

  5. Dans l’onglet Style, sélectionnez un thème :

    • Lorsque le modèle sélectionné spécifie un thème, celui-ci est automatiquement sélectionné dans l’assistant. Vous pouvez également choisir un thème différent dans l’onglet Style.
    • Si le modèle sélectionné ne spécifie aucun thème, vous pouvez utiliser l’onglet Style pour en choisir un. Le bouton Créer n’est activé qu’après la sélection d’un thème.
  6. (Facultatif) Dans l’onglet Données, sélectionnez un modèle de données :

    • Modèle de données de formulaire : un modèle de données de formulaire (FDM) vous permet d’intégrer des entités et des services provenant de sources de données disparates à un formulaire adaptatif. Choisissez le modèle de données de formulaire (FDM) si le formulaire adaptatif que vous créez implique l’extraction et l’écriture de données depuis et vers plusieurs sources de données.

    • Schéma JSON  : le schéma JSON représente la structure dans laquelle les données sont générées ou utilisées par le système back-end de votre organisation. Vous pouvez associer le schéma à un formulaire adaptatif et utiliser ses éléments pour ajouter du contenu dynamique à un formulaire adaptatif. Les éléments du schéma peuvent être utilisés dans l’onglet Objets de modèle de données de l’explorateur de contenu lors de la création d’un Forms adaptatif et tous les champs sont également ajoutés au formulaire adaptatif créé.

    Par défaut, tous les champs du modèle de données sont sélectionnés. Lorsque vous créez le formulaire adaptatif, tous les champs de modèle de données sélectionnés sont convertis en composants de formulaire adaptatif correspondants. L’assistant vous fournit des cases à cocher pour sélectionner uniquement les champs qui doivent être inclus dans le formulaire adaptatif.

  7. Dans l’onglet Envoi, sélectionnez une action d’envoi :

    • Lorsque vous sélectionnez un modèle, l’action d’envoi spécifiée dans le modèle est sélectionnée automatiquement. Vous pouvez sélectionner une autre action d’envoi dans l’onglet Envoi. L’onglet Envoi affiche toutes les actions d’envoi disponibles.

    • Lorsque le modèle sélectionné ne spécifie aucune action d’envoi, vous pouvez utiliser l’onglet Envoi pour sélectionner une action d’envoi

  8. (Facultatif) Dans l’onglet Diffusion, vous pouvez spécifier une date de publication ou de dépublication pour un formulaire adaptatif.

  9. Sélectionnez Créer. Une boîte de dialogue pour spécifier le titre, le nom et l’emplacement d’enregistrement du formulaire adaptatif s’affiche :

    • Titre Spécifie le nom d’affichage du formulaire. Le titre vous permet d’identifier le formulaire dans l’interface utilisateur Experience Manager Forms d’AEM Forms.
    • Nom :  indique le nom du formulaire. Un nœud portant le nom spécifié est créé dans le référentiel. Lorsque vous commencez à saisir un titre, la valeur du champ Nom est automatiquement générée. Vous pouvez modifier la valeur suggérée. Le champ Nom ne peut contenir que des caractères alphanumériques, des traits d’union et des traits de soulignement. Toutes les entrées non valides sont remplacées par un trait d’union.
    • Chemin d’accès : indique l’emplacement d’enregistrement du formulaire adaptatif. Vous pouvez enregistrer le formulaire adaptatif directement sur /content/dam/formsanddocuments ou créer un dossier tel que /content/dam/formsanddocuments/adaptiveforms pour enregistrer un formulaire adaptatif. Assurez-vous de créer le dossier avant de l’utiliser dans le chemin d’accès. Le champ Chemin d’accès ne crée pas de dossier automatiquement.
  10. Sélectionnez Créer. Un formulaire adaptatif est créé et s’ouvre dans l’éditeur de formulaires adaptatifs. L’éditeur affiche le contenu disponible dans le modèle. Elle affiche également la barre latérale permettant de personnaliser le formulaire créé en fonction des besoins.

    En fonction du type de formulaire adaptatif, les éléments de formulaire présents dans le schéma JSON ou le modèle de données de formulaire (FDM) associé sont affichés dans l’onglet Objets de modèle de données de l’Explorateur de contenu dans la barre latérale. Vous pouvez également faire glisser ces éléments pour créer votre formulaire adaptatif.

Modification des propriétés du modèle de formulaire d’un formulaire adaptatif edit-form-model-foundation-components

Vous pouvez modifier le modèle d’un formulaire adaptatif (basé sur JSON ou modèle de données de formulaire (FDM)). Vous ne pouvez pas passer d’un modèle de formulaire à un autre.

  1. Sélectionnez le formulaire adaptatif et sélectionnez l’icône Propriétés.

  2. Ouvrez l’onglet  Modèle de formulaire et effectuez l’une des actions suivantes.

    • Si le formulaire adaptatif ne dispose pas de modèle de formulaire, vous pouvez choisir un autre modèle de formulaire et, en conséquence, sélectionner schéma XML ou JSON ou un modèle de données de formulaire (FDM).
    • Si le formulaire adaptatif est basé sur un modèle de formulaire, vous pouvez choisir un autre schéma XML ou JSON , ou un autre modèle de données de formulaire (FDM) pour le même modèle de formulaire.
  3. Sélectionnez Enregistrer pour enregistrer les propriétés.

Vous pouvez également modifier les propriétés du modèle de formulaire à partir du créateur de formulaires adaptatifs ou du créateur de modèles de formulaires adaptatifs.

  1. Sélectionnez le composant Conteneur de formulaires adaptatifs (racine).

  2. Cliquez sur l’ icône Configurer pour ouvrir les Propriétés du conteneur de formulaires adaptatifs.

  3. Sélectionnez l’onglet Modèle de données et effectuez l’une des actions suivantes :

    • Si le formulaire adaptatif ne dispose pas de modèle de formulaire, vous pouvez choisir un modèle de formulaire et, en conséquence, sélectionner schéma XML ou JSON ou un modèle de données de formulaire (FDM).
    • Si le formulaire adaptatif est basé sur un modèle de formulaire, vous ne pouvez pas modifier le modèle de formulaire. Vous pouvez choisir un autre schéma XML ou JSON ou un autre modèle de données de formulaire (FDM) pour le même modèle de formulaire, selon le cas.
  4. Sélectionnez Enregistrer pour enregistrer les propriétés.

FDM-Schema-Support {align="center" width="100%"}

note note
NOTE
Vous pouvez également enregistrer un formulaire adaptatif en tant que modèle. Pour plus d’informations, consultez Créer un modèle à l’aide d’un formulaire adaptatif.

Étapes suivantes

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab