Show Menu
TEMAS×

Tutorial: Publicación del formulario adaptable

Este tutorial es un paso de la serie Crear su primer formulario adaptable. 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 de AEM a una instancia de publicación de AEM. El formulario se pone a disposición del 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 Forms que se ejecuta en modo de publicación. En un entorno de producción, la instancia de publicación está fuera del servidor de seguridad de la organización.
  • Configure 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 introducidos en el formulario) desde la instancia de publicación a la instancia de autor.

Publicación del formulario adaptable como página de AEM

Cuando el formulario adaptable se publica como una página de AEM, toda la página web solo contiene 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 página de AEM:
  1. Inicie sesión en la instancia de creación de AEM 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 toque Publicar . Se muestra un cuadro de diálogo que contiene recursos relacionados con el formulario adaptable. Toque Publicar . Se publica el formulario adaptable 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 Sitios de AEM

AEM Forms permite a los desarrolladores de formularios incrustar formularios adaptables sin problemas en una página Sitios de AEM. El formulario adaptable incrustado 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 incrustar un formulario adaptable en una página de AEM Sites. De forma predeterminada, el componente no está visible en AEM Sites contenedor. Siga estos pasos para activar el componente Contenedor de AEM Forms e incrustar el formulario adaptable en una página de sitios de AEM:
  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 se incrusta en la página de sitios.
    También puede incrustar el formulario adaptable en una página existente del sitio Web.Retail. 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 a continuación utilizan la página recién creada.
    El sitio Web de We.Retail se envía con AEM. Si no tiene instalado el sitio Web de We.Retail, consulte Implementación de referencia de We.Retail para instalar el sitio.
  2. Toque de la información de la página y seleccione la opción Editar plantilla en la página del sitio Web We.Retail recientemente creada. La plantilla de la página se abre en una nueva ficha del explorador.
  3. Toque dentro del cuadro de contenedor de diseño y toque . En la ficha Componentes ​permitidos, expanda el acordeón General , seleccione la opción Formulario ​AEM y toque . El componente Contenedor de AEM Forms está habilitado para la página.
  4. Abra la ficha del navegador que contiene la página Sitios AEM abierta en el paso 1. Puntee en el cuadro Arrastrar componentes aquí y toque +. En el cuadro Insertar nuevo componente , toque Formulario AEM. El componente Contenedor de AEM Forms se agrega a la página.
  5. Toque el componente contenedor de AEM Forms y toque . Aparece un cuadro de diálogo con las propiedades de AEM Forms Contenedor. En el campo Ruta del recurso, busque y seleccione el formulario adaptable Shipping-address-add-update-form. Tocar . El formulario adaptable se incrusta en la página.
  6. Publique el formulario adaptable y la página de sitios. Tenga en cuenta lo siguiente:
    • Si publica la página Sitios de AEM por primera vez e incluye un formulario incrustado, publique la página Sitios 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 de sitio publicada. La página del sitio publicada incluye una referencia al formulario y no requiere volver a publicar la página.
    • Si modifica la página Sitios y el formulario incrustado, vuelva a publicar la página Sitios y el formulario.
    Se ha agregado el formulario Cambio de dirección de envío y facturación a una página Sitios de AEM.

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 de AEM 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 de 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 Incrustar el formulario adaptable en una página web externa.