Criar um modelo de formulário adaptável com base nos Componentes principais

Última atualização em 2023-12-12

Ao criar um formulário, você adiciona campos e componentes para definir a estrutura do formulário, o conteúdo e as ações no editor. Adicione campos e componentes na guideRootPanel do contêiner de formulário. Com o Editor de modelos, você pode criar um modelo que contenha estrutura básica e conteúdo inicial que os autores possam usar para criar formulários.

Por exemplo, você deseja que todos os autores de formulários tenham determinadas caixas de texto, botões de navegação e um botão de envio em um formulário de inscrição. Você pode criar um modelo com os componentes que os autores podem usar para criar um formulário consistente com outros formulários de inscrição. Quando os autores usam o modelo para criar um Formulário adaptável, o novo formulário herda a estrutura, a estrutura e os componentes especificados no modelo. O Editor de modelos permite:

  • Adicione componentes de cabeçalho e rodapé de um formulário na camada da estrutura.
  • Forneça o conteúdo inicial para o formulário.
  • Especifique um tema, Enviar ações.

Pré-requisito

Ativar os Componentes principais adaptáveis do Forms para o seu ambiente: ao criar um programa, os Componentes principais adaptáveis do Forms já estão habilitados para o seu ambiente. Se você tiver um ambiente de formulário as a Cloud Service com base em Arquétipo AEM 39 ou anterior, Ativar os Componentes principais adaptáveis do Forms para o seu ambiente.

OBSERVAÇÃO

Ao implantar o ambiente as a Cloud Service do Forms com base no Arquétipo 45, o Forms adaptável (componente principal) modelos e temas principais baseados em componentes são adicionados ao seu ambiente.

Trabalhar com modelo

É possível acessar o editor de modelos no menu Ferramentas navegando até Adobe Experience Manager > Ferramentas > Geral > Modelos. Aqui, os modelos são organizados em pastas ativadas para modelos editáveis.

OBSERVAÇÃO

Você pode encontrar os modelos editáveis baseados nos componentes principais nas pastas específicas dos componentes principais.

O Experience Manager fornece uma pasta global para organizar modelos. No entanto, não está ativado por padrão. Você pode solicitar que o administrador ative a pasta global ou crie uma pasta para modelos. Para obter mais informações sobre como criar pastas, consulte Pastas de Modelos.

Criação de um modelo

Após criar uma pasta, abra-a e execute as seguintes etapas para criar um template:

  1. Selecionar Criar dentro da pasta que você criou.

  2. No Escolher um tipo de modelo , selecione Modelo de formulário adaptável (componente principal) e selecione Próxima.

  3. No Detalhes do modelo seção, forneça uma Título do modelo e selecione Criar.
    Você também pode fornecer uma descrição.

  4. Selecionar Concluído para retornar ao console ou selecione Abertura para abrir o modelo no editor.

Interface do editor de modelos

Ao abrir um modelo para edição, você pode ver os seguintes componentes do Editor de AEM:

  • Barra de ferramentas da página
    Contém as seguintes opções:

    • Ativar/desativar painel lateral: permite mostrar ou ocultar a barra lateral.
    • Informações da página: permite especificar informações como tempo de publicação/cancelamento de publicação, miniaturas, bibliotecas do lado do cliente, política da página e biblioteca do lado do cliente de design da página.
    • Seletor de modo: Permite alterar o modo. Você pode escolher Estrutura modo, Conteúdo inicial, Controle de layout modo. O modo Estrutura permite adicionar e personalizar o cabeçalho e o rodapé. O modo Conteúdo inicial permite personalizar o conteúdo do formulário.
    • Visualizar: Permite visualizar a aparência do modelo ao publicá-lo. Você pode usar o Seletor de camada e a Visualização para alternar entre os modos de edição e visualização.
  • Barra lateral: Fornece os navegadores de Conteúdo, Propriedades, Ativos e Componentes.

  • Barra de ferramentas do componente: Ao selecionar um componente, você vê uma barra de ferramentas que permite personalizar o componente.

  • Página: a área onde você adiciona conteúdo para criar o template.

Edição de um modelo

Os diferentes modos para selecionar e editar o aspecto apropriado do modelo são:

O seletor de camadas está disponível ao lado da opção Visualizar, no canto superior direito da tela.

Estrutura

Quando você seleciona a camada de estrutura no Editor de modelo, ela ajuda a predefinir o conteúdo que não pode ser alterado ao criar o Forms adaptável associado ao modelo.

Contêiner de layout na camada da estrutura

Bloquear/desbloquear componentes na camada da estrutura

Ao editar o modelo com a camada de estrutura selecionada, é possível desbloquear o cabeçalho e o rodapé do modelo. Se um componente estiver desbloqueado no modelo, os autores do formulário poderão editar o componente no Formulário adaptável que usa o modelo. Bloquear um componente impede que os autores do formulário o editem no Formulário adaptável. A opção Bloquear está disponível na barra de ferramentas do componente.

Por exemplo, você adiciona o componente de cabeçalho no modelo. Ao selecionar o componente, você pode ver uma opção de bloqueio na barra de ferramentas do componente. Normalmente, o cabeçalho inclui o nome da empresa e o logotipo, e você não deseja que os autores de formulários alterem o logotipo e o cabeçalho em um modelo. Em um formulário adaptável criado usando o modelo com o componente de cabeçalho bloqueado, os autores de formulário não podem alterar o logotipo e o nome da empresa.

OBSERVAÇÃO

Não é recomendado bloquear ou desbloquear a imagem ou o logotipo no componente de cabeçalho, individualmente. Você pode desbloquear o componente de cabeçalho.

Conteúdo inicial

Quando a opção Conteúdo inicial estiver selecionada, o Contêiner de formulário adaptável do modelo será aberto como um Formulário adaptável para edição. Ele permite criar um conteúdo predefinido que pode ser alterado ao criar o Forms adaptável associado ao modelo. Assim como a criação de um Formulário adaptável, você pode especificar configurações iniciais, como selecionar um tema e Enviar ações.

Os autores de formulários o usam como base para criar um formulário. A estrutura do fluxo de conteúdo é especificada na camada Conteúdo inicial do modelo. Para alternar para a edição do conteúdo inicial do modelo de formulário, antes de Visualizar na barra de ferramentas da página, selecione tela suspensa > Conteúdo inicial.

Cabeçalho e rodapé adicionados na camada Conteúdo inicial

Na camada Conteúdo inicial, crie o modelo de Formulário adaptável que seus autores usam como base. A criação de um modelo é semelhante à criação de um formulário. As opções disponíveis na Barra lateral são usadas. A barra lateral fornece conteúdo, propriedades, ativos e componentes nos navegadores.

OBSERVAÇÃO

Ao selecionar Armazenar conteúdo ou Armazenar PDF como a Ação enviar, você obtém uma opção para especificar o Caminho de armazenamento. Se você especificar o caminho no modelo, todos os formulários criados a partir dele terão o mesmo caminho. Você pode especificar o caminho de armazenamento correto ou garantir que os autores do formulário o atualizem para impedir que os dados de cada formulário sejam armazenados no mesmo local.

Layout

Ao editar um modelo, é possível definir o layout, isso usa o layout responsivo padrão. O layout ajuda a gerenciar a largura de um componente com base na largura do dispositivo para facilitar um design responsivo de formulário adaptável.

Contêiner de layout na camada da estrutura

Consulte o artigo noções básicas sobre layout responsivo para obter informações adicionais.

Habilitação do modelo

Ao criar um modelo, ele é adicionado como um rascunho. Ative o modelo para usá-lo na criação do Forms adaptável. Para ativar um modelo:

  1. Navegue até Adobe Experience Manager > Ferramentas > Modelos​e abra a pasta na qual você criou o template.
    O modelo criado está marcado como Rascunho.
  2. Selecione o modelo e selecione Ativar na barra de ferramentas.
    Ao criar um Formulário adaptável, você pode ver o modelo listado quando é solicitado a escolher um modelo.

Importação ou exportação de um template

Um formulário funciona com seu modelo. Ao baixar um Formulário adaptável criado usando um modelo personalizado, o modelo não é baixado. Ao importar o formulário para um AEM Forms instância, ela é importada sem seu template. Se um formulário for importado, mas seu template não estiver disponível, o formulário não será renderizado. É possível empacotar o modelo personalizado de /conf nó em https://<server>:<port>/crx/packmgre conecte-o à porta no AEM Forms instância na qual você deseja carregar o formulário. Também é possível Crie um modelo usando o Arquétipo AEM e implante-o na instância do Cloud Service.

OBSERVAÇÃO
  • Você também pode configurar as opções Documento do registro modelo diretamente do editor de formulário adaptável ou do editor de modelo de formulário adaptável. Para obter mais informações, consulte Gerar documento de registro para o Adaptive Forms.

Associar um esquema do modelo de dados de formulário a um modelo

Os autores podem associar um Esquema do modelo de dados de formulário para um modelo de Formulário adaptável no editor de modelos. Ele permite que os autores selecionem um esquema no editor de modelos. Quando você associa um esquema a um modelo e um autor de formulário cria um formulário com base no modelo, o esquema é pré-selecionado para o formulário. Ele ajuda os autores de formulários a regular o uso do esquema e também economiza tempo para os autores de formulários. Para selecionar um esquema de modelo de dados de formulário no editor de modelo:

  1. Selecionar Navegador de conteúdo localizado no lado esquerdo.
  2. Ir para o contêiner de formulário Configuração.
  3. Selecionar Modelo de dados.
  4. Escolher o modelo de dados do formulário por meio de Selecionar modelo de dados do formulário e salve a configuração.

Formulário-Modelo-Dados-Associação-no-Forms

Adicionar propriedades personalizadas aos Componentes de formulário adaptável usando a política de modelo

As propriedades personalizadas permitem associar atributos personalizados (pares de chave e valor) a um componente principal de formulário adaptável usando o modelo de formulário. As propriedades personalizadas são refletidas na variável propriedades da representação headless do componente. Isso permite criar um comportamento de formulário dinâmico que se adapta de acordo com os valores de atributos personalizados. Por exemplo, desenvolvedores(as) podem criar várias representações de um componente de formulário headless para plataformas móveis, de desktop ou da web, melhorando significativamente a experiência de usuário em uma grande variedade de dispositivos.

As etapas para adicionar propriedades personalizadas aos campos do componente principal do Formulário adaptável são:

  1. Adicionar um nome de grupo personalizado na política de um editor de modelo
  2. Selecione um nome de grupo personalizado na caixa de diálogo de edição de um componente do Formulário adaptável

Adicionar um nome de grupo personalizado na política do editor de modelo

  1. Ir para Adobe Experience Manager > Ferramentas > Geral > Modelos.
  2. Selecione o modelo com base nos Componentes principais e abra-o em um modo de edição.
  3. Clique em Política Política ícone de um campo Componente principal do formulário adaptável no qual as propriedades personalizadas precisam ser definidas. A variável Campo de formulário adaptável será exibida.
  4. Selecione o Propriedades Personalizadas guia.
  5. Especifique a Título da política no Política seção.
  6. Especifique a Nome do grupo e adicione o par de valor-chave associado a um grupo específico. O nome do grupo é visível para os autores do formulário na caixa de diálogo de edição de um componente. Se você selecionar o nome do grupo, cada par de valor-chave associado será aplicável a um componente.
  7. Clique em [Concluído].

Adicionar o nome do grupo de propriedades personalizadas no editor de modelo

Quando você adicionar pelo menos um grupo de propriedades personalizadas usando a política de modelo, a variável Avançado fica visível na caixa de diálogo Editar de um componente principal correspondente.

Selecione um nome de grupo personalizado na caixa de diálogo de edição de um componente principal

  1. Abra um Formulário adaptável em um modo de edição.
  2. Selecione o componente para o qual as propriedades personalizadas foram definidas no editor de modelo e selecione settings_icon para abrir a caixa de diálogo de edição do componente.
  3. Selecione o Avançado guia.
  4. Selecione o nome do grupo de propriedades personalizadas em Selecionar propriedade personalizada menu suspenso. Todos os nomes de grupos personalizados definidos são preenchidos automaticamente na lista suspensa.
  5. Selecionar Concluído para salvar as propriedades.

selecionar nome do grupo de propriedades personalizadas

OBSERVAÇÃO
  • A variável Propriedades personalizadas adicionais permite adicionar dinamicamente propriedades personalizadas específicas do componente, além daquelas fornecidas na política do modelo. A propriedade personalizada do componente específico tem prioridade sobre a propriedade personalizada definida na política do modelo quando os valores do nome da chave correspondem.

Criação de um formulário adaptável usando o modelo

Depois de criar e ativar um modelo, ele fica disponível no gerenciador de formulários quando você cria um Formulário adaptável. Para usar um modelo e criar um Formulário adaptável, consulte Criação de um formulário adaptável com base nos Componentes principais.

Práticas recomendadas

  • Crie modelos usando os componentes baseados nos Componentes principais, por exemplo, Texto de formulário adaptável, Contêiner de formulário adaptável e muito mais. Para obter informações sobre os Componentes principais adaptáveis do Forms, clique aqui.
  • Limitar o número de modelos para corresponder aos tipos de formulário fundamentalmente diferentes disponíveis nos sites
  • Forneça a flexibilidade e os recursos de configuração necessários para seus componentes personalizados usados em um modelo.

Consulte também

Nesta página