Tutorial: Publish seu formulário adaptável tutorial-publish-your-adaptive-form
Este tutorial é uma etapa da série Criar o primeiro formulário adaptável. É recomendável seguir a série em sequência cronológica para entender, executar e demonstrar o caso de uso completo do tutorial.
Quando o formulário adaptável estiver pronto, você poderá publicar o formulário para disponibilizá-lo para os usuários finais. Os usuários finais podem abrir o formulário publicado em qualquer dispositivo e navegador de Internet. Quando um formulário adaptável é publicado, o formulário e o conteúdo relacionado são copiados de uma instância de autor AEM para uma instância de publicação AEM. O formulário é disponibilizado ao usuário final por meio da instância de publicação.
Você tem os seguintes métodos para publicar um formulário adaptável:
Antes de começar before-you-start
- Configurar uma instância de publicação do AEM Forms: a instância de publicação é uma instância pública do AEM Forms em execução no modo de publicação. Em um ambiente de produção, a instância de publicação está fora do firewall da organização.
- Configurar replicação e replicação inversa: a replicação copia o conteúdo da instância do autor para uma instância de publicação e retorna a entrada do usuário (por exemplo, entrada de formulário) da instância de publicação para a instância do autor.
Publish o formulário adaptável como uma página AEM publish-the-adaptive-form-as-an-aem-page
Quando o formulário adaptável é publicado como uma página AEM, a página da Web inteira contém somente formulários publicados. É possível usar a URL do formulário adaptável para vinculá-lo a partir de outra página da Web. Para publicar o formulário adaptável delivery-address-add-update-form como uma página AEM:
- Faça logon na instância de autor do AEM Forms e localize o formulário adaptável send-address-add-update-form na interface do usuário do AEM Forms.
https://localhost:4502/aem/forms.html/content/dam/formsanddocuments
- Selecione o formulário adaptável delivery-address-add-update-form e selecione Publish. Uma caixa de diálogo contendo ativos relacionados ao formulário adaptável é exibida. Selecione Publish. O formulário adaptável é publicado e uma caixa de diálogo de sucesso é exibida.
- Abra o formulário na instância de publicação. O formulário está disponível para o usuário final preencher e enviar.
https://localhost:4503/content/forms/af/shipping-address-add-update-form.html
Incorporar o formulário adaptável em uma página do AEM Sites embed-the-adaptive-form-in-an-aem-sites-page
O AEM Forms permite que desenvolvedores de formulários incorporem formulários adaptáveis em uma página AEM Sites. O formulário adaptável incorporado é totalmente funcional e os usuários podem preencher e enviar o formulário sem sair da página. Ele ajuda o usuário a permanecer no contexto de outros elementos na página da Web e interagir simultaneamente com o formulário.
O AEM Forms fornece um componente, Contêiner AEM Forms, para incorporar um formulário adaptável a uma página AEM Sites. Por padrão, o componente não está visível no contêiner AEM Sites. Execute as seguintes etapas para habilitar o componente de Contêiner AEM Forms e incorporar o formulário adaptável em uma página AEM Sites:
-
Crie e abra uma página no site We.Retail para edição. Por exemplo, https://localhost:4502/editor.html/content/we-retail/us/en/user/shipping-and-billing-address.html. O formulário adaptável está incorporado à página Sites.
Você também pode incorporar o formulário adaptável em uma página existente do We.Retail Site’s. Por exemplo, a página SOBRE EUA https://localhost:4502/editor.html/content/we-retail/us/en/about-us.html. Economiza tempo para criar uma página. As etapas abaixo usam a página recém-criada.
O site We.Retail é enviado com AEM. Se você não tiver o site We.Retail instalado, consulte Implementação de referência We.Retail para instalar o site.
-
Selecione as informações da página e selecione a opção Editar Modelo na página do site We.Retail recém-criada. O modelo da página é aberto em uma nova guia do navegador.
-
Selecione dentro da caixa contêiner de layout e selecione . Na guia Componentes Permitidos, expanda a opção Geral, selecione a opção Formulário AEM e selecione . O componente de Contêiner AEM Forms está habilitado para a página.
-
Abra a guia do navegador contendo a página AEM Sites aberta na etapa 1. Selecione a caixa Arraste componentes aqui e selecione +. Na caixa Inserir novo componente, selecione Formulário AEM. O componente Contêiner do AEM Forms é adicionado à página.
-
Selecione o componente contêiner de AEM Forms e selecione . Uma caixa de diálogo com propriedades do Contêiner AEM Forms é exibida. No campo Caminho do ativo, navegue e selecione o formulário adaptável delivery-address-add-update-form. Selecione . O formulário adaptável é incorporado na página.
-
Publish o formulário adaptável e a página Sites. Estes são alguns pontos a serem considerados:
-
Se você publicar a página Sites do AEM pela primeira vez e ela incluir um formulário inserido, publique a página Sites e o formulário inserido.
-
Se você modificar apenas o formulário inserido em uma página de site publicada, publique o formulário original e as alterações refletirão na página de site publicada. A página do site publicada inclui uma referência ao formulário e não requer a republicação da página.
-
Se você modificar a página Sites e o formulário inserido, republique a página Sites e o formulário.
Formulário de alteração de endereço de remessa e cobrança adicionado a uma página AEM Sites.
-
Incorporar o formulário adaptável em uma página da Web externa embed-the-adaptive-form-in-an-external-webpage
É possível incorporar um formulário adaptável a uma página da Web externa (uma página da Web não AEM hospedada fora do AEM) inserindo algumas linhas do JavaScript na página da Web externa. O código JavaScript envia uma solicitação HTTP para o servidor AEM Forms para o formulário adaptável e recursos relacionados e adiciona o formulário adaptável à página da Web. Para obter etapas detalhadas, consulte incorporar o formulário adaptável a uma página da Web externa.