Tutorial: Publicar el formulario adaptable

Este tutorial es un paso de la serie Create Your First Adaptive Form. Se recomienda seguir la serie en secuencia cronológica para comprender, realizar y demostrar el caso de uso completo del tutorial.

Una vez que el formulario adaptable esté listo, puede publicarlo para que esté disponible para los usuarios finales. Los usuarios finales pueden abrir el formulario publicado en cualquier dispositivo y navegador de Internet. Cuando se publica un formulario adaptable, el formulario y el contenido relacionado se copian de una instancia de autor AEM a una instancia de publicación AEM. El formulario está disponible para el usuario final a través de la instancia de publicación.

Tiene los siguientes métodos para publicar un formulario adaptable:

Antes de comenzar

  • Configure una instancia de publicación de AEM Forms: La instancia de publicación es una instancia pública de AEM que se Forms ejecuta en modo de publicación. En un entorno de producción, la instancia de publicación está fuera del cortafuegos de la organización.
  • Configurar la replicación y la replicación inversa: La replicación copia el contenido de la instancia de autor en una instancia de publicación y devuelve los datos introducidos por el usuario (por ejemplo, los datos de entrada de formulario) de la instancia de publicación a la instancia de autor.

Publicar el formulario adaptable como una página AEM

Cuando el formulario adaptable se publica como una página AEM, toda la página web contiene solo un formulario publicado. Puede utilizar la dirección URL del formulario adaptable para vincularlo desde otra página web. Para publicar el formulario adaptable Shipping-address-add-update-form como una página AEM:

  1. Inicie sesión en AEM instancia de autor Forms y busque el formulario adaptable Shipping-address-add-update-form en la interfaz de usuario de AEM Forms.
    https://localhost:4502/aem/forms.html/content/dam/formsanddocuments
  2. Seleccione el formulario adaptable Shipping-address-add-update-form y pulse Publicar. Se muestra un cuadro de diálogo que contiene recursos relacionados con el formulario adaptable. Toque Publicar. El formulario adaptable se publica y aparece un cuadro de diálogo de éxito.
  3. Abra el formulario en la instancia de publicación. El formulario está disponible para que el usuario final lo rellene y lo envíe.
    https://localhost:4503/content/forms/af/shipping-address-add-update-form.html

Incrustar el formulario adaptable en una página de AEM Sites

AEM Forms permite a los desarrolladores de formularios incrustar formularios adaptables sin problemas en una página AEM Sites. El formulario adaptable integrado es totalmente funcional y los usuarios pueden rellenar y enviar el formulario sin salir de la página. Ayuda al usuario a permanecer en el contexto de otros elementos de la página web e interactuar simultáneamente con el formulario.

AEM Forms proporciona un componente, AEM Forms Contenedor, para integrar un formulario adaptable en una página AEM Sites. De forma predeterminada, el componente no está visible en AEM contenedor Sites. Realice los siguientes pasos para habilitar el componente Contenedor de AEM Forms e incrustar el formulario adaptable en una página de AEM Sites:

  1. Cree y abra una página en el sitio de We.Retail para editarla. Por ejemplo, https://localhost:4502/editor.html/content/we-retail/us/en/user/shipping-and-billing-address.html. El formulario adaptable está incrustado en la página Sites.

    También puede incrustar el formulario adaptable en una página de We.Retail Site’s existente. Por ejemplo, la página ABOUT US https://localhost:4502/editor.html/content/we-retail/us/en/about-us.html. Le ahorra tiempo para crear una página. Los pasos siguientes utilizan la página recién creada.

    El sitio de We.Retail se envía con AEM. Si no tiene instalado el sitio de We.Retail, consulte Implementación de referencia de We.Retail para instalar el sitio.

  2. Pulse properties en la información de página y seleccione la opción Editar plantilla en la página del sitio de We.Retail recién creada. La plantilla de la página se abre en una nueva pestaña del explorador.

  3. Pulse dentro del cuadro contenedor de diseño y pulse administración de fuentes. En la pestaña Componentes permitidos, expanda el acordeón General, seleccione la opción AEM Formulario y pulse save_icon. El componente Contenedor de AEM Forms está habilitado para la página.

  4. Abra la pestaña del explorador que contiene AEM página Sites abierta en el paso 1. Pulse el cuadro Arrastrar componentes aquí y pulse +. En el cuadro Insertar nuevo componente, pulse AEM formulario. El componente Contenedor de AEM Forms se agrega a la página.

  5. Pulse el componente Contenedor de AEM Forms y pulse configure-icon. Aparece un cuadro de diálogo con propiedades de AEM Forms Contenedor. En el campo Asset Path, busque y seleccione el formulario adaptable Shipping-address-add-update-form. Pulse save_icon. El formulario adaptable está incrustado en la página .

  6. Publique el formulario adaptable y la página Sites. Tenga en cuenta lo siguiente:

    • Si publica la página AEM Sites por primera vez e incluye un formulario incrustado, publique la página Sites y el formulario incrustado.

    • Si solo modifica el formulario incrustado en una página de sitio publicada, publique el formulario original y los cambios se reflejarán en la página del sitio publicada. La página del sitio publicada incluye una referencia al formulario y no requiere que se vuelva a publicar la página.

    • Si modifica la página Sites y el formulario incrustado, vuelva a publicar la página Sites y el formulario.

      embed-in-aem-sites
      Formulario de cambio de dirección de envío y facturación agregado a una página de AEM Sites.

Incrustar el formulario adaptable en una página web externa

Puede incrustar un formulario adaptable en una página web externa (una página web que no sea AEM y que esté alojada fuera de AEM) insertando algunas líneas de JavaScript en la página web externa. El código JavaScript envía una solicitud HTTP al servidor AEM Forms para el formulario adaptable y los recursos relacionados, y agrega el formulario adaptable a la página web. Para ver los pasos detallados, consulte integrar el formulario adaptable en una página web externa.

En esta página