Adicionar um modal de janela de visualização à sua experiência

Adicione uma janela de visualização em um modal na sua experiência.

Antes de Iniciar

Função necessária: ui_builder_admin

Por Que e Quando Desempenhar Esta Tarefa

Use modais de janela de visualização para incorporar subpáginas ou outras experiências em um modal em sua página ou experiência primária. Os modais da janela de visualização podem ser abertos por meio de eventos ou scripts. Os modais da janela de exibição são limitados a uma sub-rota por modal da janela de exibição. Você pode criar modais de janela de visualização adicionais para rotas extras.

Nota:

Os modais de janela de visualização legados não podem ser atualizados e devem ser recriados para aproveitar a nova funcionalidade.

Procedimento

1. Navegar até Tudo > Estrutura do Now Experience > Construtor de IU.
2. Abra uma experiência para trabalhar ou crie uma experiência selecionando Criar > Experiência.
   Para obter mais informações, consulte Configure como os usuários interagem com suas aplicações no Construtor de IU.
3. Abra ou crie uma página.
   Se você abrir uma página existente, verifique se está no mesmo escopo da página original. Caso contrário, altere o escopo antes de começar a editar a página. O escopo da aplicação protege as aplicações identificando e restringindo o acesso a dados e arquivos de aplicações. Os administradores definem o escopo para especificar quais partes de uma aplicação podem ser acessadas por outras aplicações. O escopo da aplicação protege os dados e os arquivos de aplicações. Consulte Saiba mais sobre segurança e funções para obter mais informações sobre o escopo da aplicação.
4. Selecione + Adicionar conteúdo na árvore de conteúdo.
5. Selecione um layout de coluna única.
6. Selecione + ao lado de Modais na árvore de conteúdo.
7. Selecione o modal da janela de visualização na lista.

   Figura 1. Modal da janela de visualização

   

   Um modelo de janela de visualização aparece acima da página.
8. Clique em Salvar.
9. Selecione a janela de visualização na árvore de conteúdo.
   
10. Selecione + Adicionar ao lado de Coleções de páginas na guia Configurar.
    
11. Selecione uma coleção de páginas ou crie uma nova.
    Para obter mais informações, consulte Criar uma coleção de páginas em várias páginas de IU.

    

12. Clique em Adicionar.
13. Clique em Salvar.
14. Adicione um componente que abre o modal da janela de visualização.

    O exemplo a seguir usa um botão para abrir o modal da janela de visualização.

    

15. Selecione a guia Eventos.
16. Selecione + Adicionar manipulador de eventos.
    
17. Selecione Abrir ou fechar caixa de diálogo modal.
18. Habilite a caixa de diálogo Abrir modal.
19. Selecione o modal da janela de visualização que você criou no menu suspenso Modal.
    
    O ID da janela de visualização é preenchido automaticamente.
20. Selecione Adicionar.
21. Selecione Save (Salvar).
22. Exiba e teste sua página selecionando .