--- sourceDocument: Interface do usuário da Now Platform Yokohama sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/pt-BR/yokohama/platform-user-interface Release : - yokohama ft:locale : - pt-BR ft:publication_title : - Interface do usuário da Now Platform Yokohama ft:clusterId : - platux bundleId : - platux workflow : - Platform --- # Gerencie ou edite um tema com Construtor de temas # Gerencie ou edite um tema com Construtor de temas {#ariaid-title1} * Versão de lançamento: Yokohama * * Atualizado 30 de jan. de 2025 * * ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 3 min. de leitura Personalize e gerencie seu tema e estilo de maneira econômica e econômica. Depois de personalizar, publique seu novo tema em uma implementação web ou móvel da sua instância. ## Antes de Iniciar Função necessária: administrador ## Procedimento 1. Navegar até TudoEstrutura do Now ExperienceTemasConstrutor de temas. A página principal do Construtor de temas é exibida na exibição da página inicial. 2. Na exibição da página inicial, selecione o tema que você deseja editar na exibição da página Gerenciador ou Editor. Figura 1. Menu de página * Na exibição da página Gerente, você tem a opção de exibir os temas existentes de duas maneiras. Você pode escolher a exibição em Grade ou a exibição em Lista. Nota: Nas exibições Grade e Lista, seus temas publicados e não publicados são agrupados separadamente. Os temas publicados são temas que aparecem na preferência de tema do usuário. Para exibir seus temas da web e para celular, selecione Web ou Mobile botão. Figura 2. Exibição em grade Figura 3. Exibição em lista Mais ações ( ![Ícone Mais ações.]()) o ícone de temas publicados contém as seguintes opções: * Duplicar * Excluir * Adicionar paleta de cores alternativa * Cancelar publicação * Marcar como padrão Nota: Esta opção aparece se o tema não for o tema padrão atual. {#tb-edit-theme__ul_hj4_2nb_1cc} Mais ações ( ![Ícone Mais ações.]()) para temas publicados com as paletas de cores alternativas definidas contém as seguintes opções: * Editar nome do grupo * Duplicar * Excluir * Cancelar publicação * Marcar como padrão Nota: Esta opção aparece se o tema não for o tema padrão atual. {#tb-edit-theme__ul_ptk_3dc_1cc} Mais ações ( ![Ícone Mais ações.]()) para os temas não publicados contém as seguintes opções: * Duplicar * Excluir * Adicionar paleta de cores alternativa * Publicar {#tb-edit-theme__ul_zh5_2pb_1cc} * Na exibição da página do Editor, você pode selecionar o tema que deseja editar na lista suspensa Tema. Figura 4. Selecione um tema na lista suspensa Tema {#tb-edit-theme__ul_mwg_2db_fxb} Nota: Ao selecionar o tema no qual você deseja trabalhar, verifique se selecionou o escopo correto para o tema no seletor de escopo da aplicação.Figura 5. Seletor de escopo da aplicação 3. Revise e atualize os estilos globais, conforme necessário. Figura 6. Revise estilos globais Nota: Os seguintes registros de estilo são gerados com seu tema: * Sua paleta de marca : Atualize as cores da interface da sua marca. * Logotipo : Atualize o logotipo. Você pode carregar o logotipo durante a aplicação do tema a partir de imagens ou da página de visão geral. Para obter mais informações, consulte [Carregue um logotipo ao publicar um tema com Construtor de temas](https://servicenow-prod.fluidtopics.net/7Yro1qwQZoNXXc7hvINyOA "Carregue seu logotipo ao publicar um tema na sua instância usando a exibição do Editor. Se você aplicou anteriormente um logotipo ao seu tema, poderá carregar um novo no Construtor de temas."). * Família de fontes : Atualize as fontes aplicadas globalmente à sua experiência. As fontes são usadas em títulos, títulos, legendas, corpo do texto e legendas. * Forma : Atualize as formas de canto dos componentes na tela. {#tb-edit-theme__ul_kb5_l1d_dxb} 1. **Opcional:** Para alterar as cores de IU geradas automaticamente para uma edição mais detalhada, selecione a Paleta de cores ( ![Ícone de paleta de cores.]()) No painel de cores Estilos globais. Use a lista suspensa ao lado de cada elemento de IU para acessar as opções de cor. Nota: Depois de salvar as mudanças em qualquer um dos ganchos de cor, um símbolo Remover substituição será exibido. Selecione o símbolo Remover substituição para reverter suas mudanças de volta para as cores originais geradas automaticamente. ![Remover símbolo de substituição.]() {#tb-edit-theme__substeps_wgb_sgz_ddc} 4. **Opcional:** Para visualizar seu tema antes de publicá-lo em sua instância, selecione Visualização da experiência . ![Guia de visualização da experiência.]() Selecione a experiência que você deseja visualizar na lista suspensa Experiência. Uma instância real é exibida com todas as seleções de tema aplicadas. Você pode visualizá-lo antes de implementar os temas selecionados na instância real. Nota: Selecione Abrir em uma nova guia ( ![Abrir em uma nova guia.]()) para abrir a experiência em uma nova guia. Você pode ver como seu tema não publicado interage com a experiência selecionada. Figura 7. Visualização da sua experiência com o tema aplicado Nota: Para temas publicados, os dados na visualização da experiência são dados dinâmicos. As mudanças feitas na visualização são refletidas na sua instância. 5. Publique seu tema. Para obter mais informações, consulte [Publique seus temas com Construtor de temas](https://servicenow-prod.fluidtopics.net/WbbdPyAUiOYa2i5atsHSdg "Publique vários temas em sua instância da web ou um único tema em sua instância móvel para refletir a marca da sua empresa."). * **[Paletas de cores, variantes e estilos principais](https://servicenow-prod.fluidtopics.net/RcRMKFdiVErSlP0X8ci9Kw)** Você pode personalizar a aparência do Next ExperienceIU para diferentes usuários, configurando os estilos principais, variantes e paletas de cores alternativas. * **tb-edit-color-palette.html** * **tb-preview-components.html** * **[Editar componentes](https://servicenow-prod.fluidtopics.net/6c~XE7rd0Ra6SNZBn30Duw)** Editar Construtor de temascomponentes individuais para melhor se adequarem à sua marca e para atender aos padrões de conformidade de acessibilidade. Os ganchos de tema que você pode editar são específicos para cada tipo de componente.