Uso de compañeros para crear una página de contacto de AEM Sites con un formulario adaptable

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

Información general

Coworker Enterprise proporciona una forma con asistencia de IA de realizar tareas en Adobe Experience Manager (AEM) siguiendo instrucciones en lenguaje natural. En lugar de realizar manualmente todos los pasos de creación y configuración, los usuarios pueden describir la experiencia que desean crear y los compañeros pueden ayudar a ejecutar las tareas compatibles en AEM.

Los compañeros de trabajo trabajan de forma interactiva y pueden realizar preguntas de seguimiento cuando necesiten información adicional, como una página de referencia, una configuración existente o un servicio para utilizar. Esto permite combinar la creación asistida por IA con recursos, componentes, formularios e integraciones de AEM existentes.

En este artículo, utilizamos Coworker para ayudar a crear una experiencia de Contacto con AEM Sites, que incluye la creación de la página y el formulario adaptable, la configuración de una búsqueda de código postal y la configuración del envío de formularios a una configuración de almacenamiento de Azure existente.

Este tutorial muestra cómo usar Coworker para crear una página de Contáctenos de AEM Sites que incluya:

  • Un banner con temas bancarios de ancho completo
  • Un formulario adaptable incrustado en la página de AEM Sites
  • Diseño de formulario de dos columnas
  • Comportamiento interactivo para tabletas y dispositivos móviles
  • Agrupación lógica de información de clientes y detalles de consulta

La página se creará en:

/content/bankingapplication/us/contact-us

Requisitos previos

Antes de empezar, asegúrese de que:

Tiene acceso a un entorno de AEM con los permisos necesarios para crear y modificar páginas de Sites y Forms adaptable.

En los ejemplos utilizados en este artículo, la aplicación de banca es el proyecto de AEM configurado en nuestro entorno y la página Contáctenos se crea en /content/bankingapplication/us.

El nombre y la estructura de contenido del proyecto de AEM pueden ser diferentes. Reemplace las rutas de ejemplo de este artículo por el nombre de proyecto y la ubicación de contenido adecuados para su entorno de AEM.

Del mismo modo, se puede crear un Forms adaptable y recursos relacionados en la ubicación adecuada para su proyecto; no necesitan utilizar las mismas rutas que se muestran en este artículo.

Paso 1: Abrir Compañero

Abra Compañero de trabajo y proporcione una solicitud en lenguaje natural que describa la página que desea crear.

El mensaje debe incluir lo siguiente:

  1. La ubicación de la página
  2. La estructura de página deseada
  3. Los requisitos del banner
  4. Los requisitos del formulario adaptable
  5. El diseño de dos columnas
  6. El comportamiento interactivo
  7. Los campos requeridos en el formulario
  8. Las expectativas visuales y de accesibilidad

Un mensaje detallado generalmente produce un resultado más predecible que una solicitud breve como “Crear una página de Contacto”.

Paso 2: Proporcionar el indicador de creación de página

Copie y pegue el siguiente mensaje en Compañero de trabajo:

Paso 2: Proporcionar el indicador de creación de página

Copie y pegue el siguiente mensaje en Compañero de trabajo:

Me gustaría crear una página de Contáctenos en AEM Sites en la siguiente ruta de contenido:

/content/bankingapplication/us

Requisitos de página

1. Titular bancario de ancho completo

  • Añada una imagen de titular/imagen a pantalla completa que abarque la anchura completa de la página.
  • Cree una imagen de titular adecuada con un tema moderno de servicios bancarios y financieros.
  • La imagen debe transmitir confianza, profesionalidad, seguridad y servicio al cliente.
  • El banner debe funcionar bien en diseños de escritorio, tabletas y móviles.

2. Formulario adaptable

  • En la mitad inferior de la página, agregue un Formulario adaptable de AEM directamente en la página de AEM Sites.
  • Organice los campos de formulario de forma lógica en dos paneles/columnas en paralelo en el escritorio.
  • En tabletas y dispositivos móviles, los paneles deben apilarse verticalmente para proporcionar una experiencia adaptable.

Panel izquierdo - Su información

  • Nombre
  • Dirección de correo electrónico
  • Dirección física
  • Ciudad
  • Estado
  • Código ZIP

Panel Derecho: ¿Cómo Podemos Ayudarlo?

  • Tipo de consulta
  • Asunto
  • Mensaje / Comentarios
  • Hora de contacto preferida

Coloque el botón Enviar en una posición lógica debajo de los campos del formulario para que el formulario general parezca equilibrado y fácil de usar.

Ubicación de página

Cree la página Póngase en contacto con nosotros en:

/content/bankingapplication/us/contact-us

Responder a las preguntas de seguimiento del compañero de trabajo

Después de enviar el mensaje, el colaborador puede hacer preguntas adicionales antes de crear la página de AEM Sites. Estas preguntas ayudan a los colaboradores a comprender la estructura del sitio existente, las convenciones de diseño, los componentes disponibles y la implementación deseada.

Respuesta del compañero

Respuesta de compañero

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