Utilisation d’un collègue pour créer une page Nous contacter AEM Sites avec un formulaire adaptatif
[AEM_Forms_as_a_Cloud_Service]{class="badge informative"}
Vue d’ensemble
Coworker Enterprise fournit un moyen assisté par l’IA daccomplir des tâches dans Adobe Experience Manager (AEM) à l’aide d’instructions en langage naturel. Au lieu d’effectuer manuellement chaque étape de création et de configuration, les utilisateurs peuvent décrire l’expérience qu’ils souhaitent créer et un collègue peut les aider à exécuter les tâches prises en charge dans AEM.
Il travaille de manière interactive et peut poser des questions complémentaires lorsqu’il a besoin d’informations supplémentaires, telles qu’une page de référence, une configuration existante ou un service à utiliser. Cela permet d’associer la création assistée par IA aux ressources, composants, formulaires et intégrations AEM existants.
Dans cet article, nous utilisons Coworker pour nous aider à créer une expérience Nous contacter AEM Sites, y compris la création de la page et du formulaire adaptatif, la configuration d’une recherche de code postal et la configuration de l’envoi du formulaire vers une configuration de stockage Azure existante.
Ce tutoriel explique comment utiliser Collègue pour créer une page AEM Sites Nous contacter qui comprend :
- Une bannière pleine largeur sur le thème de la banque
- Un formulaire adaptatif incorporé dans la page AEM Sites
- Disposition de formulaire à deux colonnes
- Comportement réactif pour les tablettes et les appareils mobiles
- Regroupement logique des informations sur le client et des détails de demande
La page sera créée sous :
/content/bankingapplication/us/contact-us
Conditions préalables
Avant de commencer, assurez-vous des points suivants :
Vous avez accès à un environnement AEM avec les autorisations requises pour créer et modifier des pages Sites et un Forms adaptatif.
Dans les exemples utilisés tout au long de cet article, bankingapplication est le projet AEM configuré dans notre environnement, et la page Nous contacter est créée sous /content/bankingapplication/us.
Le nom de votre projet AEM et la structure de contenu peuvent être différents. Remplacez les exemples de chemins d’accès dans cet article par le nom du projet et l’emplacement de contenu appropriés pour votre environnement AEM.
De même, le Forms adaptatif et les ressources connexes peuvent être créés à l’emplacement approprié pour votre projet ; ils n’ont pas besoin d’utiliser les mêmes chemins d’accès que ceux présentés dans cet article.
Étape 1 : Ouvrir un collègue
Ouvrez Coworker et fournissez une requête en langage naturel décrivant la page que vous souhaitez créer.
L’invite doit inclure :
- Emplacement de la page
- La structure de page souhaitée
- Exigences en matière de bannières
- Exigences relatives aux formulaires adaptatifs
- La disposition à deux colonnes
- Le comportement réactif
- Les champs obligatoires sur le formulaire
- Les attentes en matière de visuel et d’accessibilité
Une invite détaillée produit généralement un résultat plus prévisible qu’une courte requête telle que « Créer une page Nous contacter ».
Étape 2 : fournir l’invite de création de page
Copiez et collez l’invite suivante dans Coworker :
Étape 2 : fournir l’invite de création de page
Copiez et collez l’invite suivante dans Coworker :
Je souhaite créer une page Nous contacter dans AEM Sites sous le chemin de contenu suivant :
/content/bankingapplication/us
Exigences de page
1. Bannière bancaire pleine largeur
- Ajoutez une bannière/image principale couvrant toute la largeur de la page.
- Créez une image de bannière appropriée avec un thème moderne de services bancaires et financiers.
- Le visuel doit véhiculer la confiance, le professionnalisme, la sécurité et le service à la clientèle.
- La bannière doit fonctionner correctement sur les dispositions pour ordinateurs de bureau, tablettes et appareils mobiles.
2. Contactez-nous Formulaire adaptatif
- Dans la moitié inférieure de la page, ajoutez un formulaire adaptatif directement dans la page AEM Sites.
- Organisez de manière logique les champs de formulaire en deux panneaux/colonnes côte à côte sur le bureau.
- Sur les tablettes et les appareils mobiles, les panneaux doivent s’empiler verticalement pour fournir une expérience réactive.
Volet De Gauche - Vos Informations
- Nom
- Adresse e-mail
- Adresse Postale
- Ville
- État
- Code postal
Panneau De Droite - Comment Pouvons-Nous Vous Aider ?
- Type de demande
- Objet
- Message / Commentaires
- Durée de contact préférée
Placez le bouton Envoyer à un emplacement logique sous les champs du formulaire, de sorte que le formulaire dans son ensemble soit équilibré et facile à utiliser.
Emplacement de la page
Créez la page Nous contacter à l’adresse :
/content/bankingapplication/us/contact-us
Répondre aux questions de suivi du collègue
Après l’envoi de l’invite, un collègue peut poser des questions supplémentaires avant de créer la page AEM Sites. Ces questions aident le collaborateur à comprendre la structure existante du site, les conventions de conception, les composants disponibles et l’implémentation souhaitée.
Réponse du collègue
