Verwenden von Coworker zum Erstellen einer AEM Sites-Kontaktseite mit einem adaptiven Formular

[AEM Forms as a Cloud Service]{class="badge informative"}

Überblick

Coworker Enterprise bietet eine KI- Möglichkeit, Aufgaben in Adobe Experience Manager (AEM) mithilfe von Anleitungen in natürlicher Sprache auszuführen. Anstatt jeden Authoring- und Konfigurationsschritt manuell durchzuführen, können Benutzende das Erlebnis beschreiben, das sie erstellen möchten, und Kollegen können dabei helfen, unterstützte Aufgaben in AEM auszuführen.

Ein Mitarbeiter arbeitet interaktiv und kann Folgefragen stellen, wenn zusätzliche Informationen benötigt werden, z. B. eine Referenzseite, eine vorhandene Konfiguration oder ein Service, den er verwenden muss. Dies ermöglicht die Kombination von KI-unterstütztem Authoring mit vorhandenen AEM-Assets, -Komponenten, -Formularen und -Integrationen.

In diesem Artikel verwenden wir Mitarbeitende, um ein AEM Sites-Kontakterlebnis zu erstellen. Dazu gehören das Erstellen der Seite und des adaptiven Formulars, das Konfigurieren einer Postleitzahlsuche und das Einrichten der Formularübermittlung an eine bestehende Azure-Speicherkonfiguration.

In diesem Tutorial erfahren Sie, wie Sie Coworker verwenden, um eine AEM Sites-Seite Kontakt zu erstellen, die Folgendes enthält:

  • Ein Banner mit dem Thema „Banking“ in voller Breite
  • Ein in die AEM Sites-Seite eingebettetes adaptives Formular
  • Ein zweispaltiges Formular-Layout
  • Responsives Verhalten für Tablets und Mobilgeräte
  • Logische Gruppierung von Kundeninformationen und Anfragedetails

Die Seite wird erstellt unter:

/content/bankingapplication/us/contact-us

Voraussetzungen

Bevor Sie beginnen, stellen Sie Folgendes sicher:

Sie haben Zugriff auf eine AEM-Umgebung mit den erforderlichen Berechtigungen zum Erstellen und Ändern von Sites-Seiten und adaptiver Forms.

In den Beispielen, die in diesem Artikel verwendet werden, ist bankingapplication das in unserer Umgebung konfigurierte AEM-Projekt, und die Seite „Contact Us“ wird unter /content/bankingapplication/us erstellt.

Ihr AEM-Projektname und Ihre Inhaltsstruktur können unterschiedlich sein. Ersetzen Sie die Beispielpfade in diesem Artikel durch den entsprechenden Projektnamen und Inhaltsspeicherort für Ihre AEM-Umgebung.

Ebenso können adaptive Forms und zugehörige Assets am entsprechenden Speicherort für Ihr Projekt erstellt werden; sie müssen nicht die gleichen Pfade verwenden, die in diesem Artikel gezeigt werden.

Schritt 1: Kollegen öffnen

Öffnen Sie den -Mitarbeiter und stellen Sie eine Anforderung in natürlicher Sprache bereit, die die Seite beschreibt, die Sie erstellen möchten.

Die Eingabeaufforderung sollte Folgendes enthalten:

  1. Die Position der Seite
  2. Die gewünschte Seitenstruktur
  3. Die Banneranforderungen
  4. Die Anforderungen für adaptive Formulare
  5. Das zweispaltige Layout
  6. Das responsive Verhalten
  7. Die für das Formular erforderlichen Felder
  8. Die Erwartungen an Visualisierung und Barrierefreiheit

Eine detaillierte Eingabeaufforderung liefert im Allgemeinen ein vorhersehbareres Ergebnis als eine kurze Anfrage, z. B. „Erstellen einer Kontaktseite“.

Schritt 2: Eingeben der Eingabeaufforderung zur Seitenerstellung

Kopieren Sie die folgende Eingabeaufforderung und fügen Sie sie in „Mitarbeiter“ ein:

Schritt 2: Eingeben der Eingabeaufforderung zur Seitenerstellung

Kopieren Sie die folgende Eingabeaufforderung und fügen Sie sie in „Mitarbeiter“ ein:

Ich möchte in AEM Sites eine Seite Kontakt unter dem folgenden Inhaltspfad erstellen:

/content/bankingapplication/us

Seitenanforderungen

1. Vollbreite Banking-Banner

  • Fügen Sie ein Banner/Hero-Bild hinzu, das die gesamte Breite der Seite umfasst.
  • Erstellen Sie ein passendes Bannerbild mit dem Modern Banking and Financial Services Theme.
  • Das visuelle Design soll Vertrauen, Professionalität, Sicherheit und Kundenservice vermitteln.
  • Das Banner sollte in allen Layouts für Desktops, Tablets und Mobilgeräte gut funktionieren.

2. Kontakt Adaptives Formular

  • Fügen Sie in der unteren Seitenhälfte ein adaptives AEM-Formular direkt innerhalb der AEM Sites-Seite hinzu.
  • Organisieren Sie die Formularfelder auf Desktop logisch in (zwei nebeneinander liegende Bereiche/Spalten.
  • Auf Tablets und Mobilgeräten sollten die Bedienfelder vertikal gestapelt sein, um ein responsives Erlebnis zu bieten.

Linkes Bedienfeld - Ihre Informationen

  • Name
  • E-Mail-Adresse
  • Adresse Straße
  • Stadt
  • Bundesland
  • Postleitzahl

Rechtes Bedienfeld - Wie können wir helfen?

  • Anfragetyp
  • Betreff
  • Nachricht/Kommentare
  • Bevorzugte Kontaktzeit

Platzieren Sie die Senden-Schaltfläche an einer logischen Position unter den Formularfeldern, damit das Formular insgesamt ausgewogen und einfach zu verwenden ist.

Position der Seite

Erstellen Sie die Seite Kontakt unter:

/content/bankingapplication/us/contact-us

Antworten auf Folgefragen von Kollegen

Nach dem Senden der Eingabeaufforderung kann der Mitarbeiter zusätzliche Fragen stellen, bevor er die AEM Sites-Seite erstellt. Diese Fragen helfen Coworker, die vorhandene Site-Struktur, Design-Konventionen, verfügbare Komponenten und die gewünschte Implementierung zu verstehen.

Antwort des Kollegen

Coworker-response

recommendation-more-help
experience-manager-learn-help-cloud-service