Como fazer upgrade de layouts no Construtor de IU

Faça upgrade de layouts criados em Quebec e Rome para o novo sistema de layout.

O sistema de layout Construtor de IU foi aprimorado e atualizado na versão San Diego. Este novo sistema de layout apresenta uma árvore de conteúdo simplificada e um novo painel de estilo para configuração de layout e estilo de componente. Todas as variantes de página recém-criadas usam o novo sistema de layout. Você tem a opção de fazer upgrade para o novo sistema de layout para páginas existentes e personalizadas.

O novo sistema de layout inclui o seguinte:

• Uma árvore de conteúdo simplificada
• Painel de estilo aprimorado para configuração de layout e estilo de componente
• IU com low-code para configurar layouts de grade e flexbox de CSS.
• IU aprimorada para estilização de componente
• Layouts atualizados não precisam de slots

O que observar após o upgrade de layouts

As variantes e páginas são atualizadas individualmente.

Uma página/variante é composta por um layout, componentes e subcomponentes que são encapsulados em um contêiner em um layout com recursos de dados, vinculações de eventos e composição. Somente o layout da sua página é atualizado ao atualizar para o novo sistema de layout, portanto, não há impacto nos dados, componentes ou no estilo do componente.

Todos os slots no sistema de layout antigo são migrados durante o processo de upgrade para o novo layout. O processo de upgrade muda a forma como os contêineres de componentes são estruturados em sua página.

Embora o estilo do componente não seja afetado, pode não haver uma migração de estilo individual de como os componentes foram posicionados. Páginas complexas podem ter desalinhamentos visuais que ocorrem durante o processo de upgrade, pois os estilos são mesclados de slots para contêineres. Alguns problemas devem ser resolvidos manualmente.

Faça upgrade do seu layout para o novo sistema de layout

Faça upgrade de suas páginas Construtor de IU para o novo sistema de layout.

Antes de Iniciar

Função necessária: ui_builder_admin

Procedimento

1. Navegar até Todos > Estrutura do Now Experience > Construtor de IU.
2. Abra uma experiência com a página da qual você deseja fazer upgrade.
   Consulte Configure como os usuários interagem com suas aplicações no Construtor de IU para obter mais informações sobre como criar experiências.
3. Selecione a página da qual você deseja fazer upgrade.
   

   Você pode encontrar variantes de página que podem ser atualizadas para o novo sistema de layout marcado com um ponto vermelho.

   Nota:

   As páginas legadas criadas usando o sistema de layout de linha/coluna pré-Quebec não são atualizáveis e devem ser recriadas com o novo sistema de layout.
4. Selecione o botão Atualizar layout.
   
   Construtor de IU começa a atualizar o layout da página para o novo sistema de layout. Uma notificação aparece quando o processo é concluído.
5. Você pode comparar seu layout antigo com o layout atualizado selecionando comparar as duas versões de layout na notificação Layout precisa de revisão antes de editar.
   
   Duas guias do navegador são abertas, uma exibindo o layout atual e uma exibindo o layout atualizado.
6. Selecione Manter novo se quiser atualizar a página para o novo sistema de layout ou Usar antigo se quiser manter o layout da página como estava.
   Um modal aparece solicitando que você confirme sua seleção.
7. Selecione Manter novo para concluir o upgrade para o novo sistema de layout ou Usar antigo para reverter o processo de upgrade e retornar a página para o sistema de layout antigo.
   
8. A página é recarregada com as mudanças aplicadas.
9. Exiba e teste sua página selecionando o botão Visualizar (botão ).