Configurar identidade visual do catálogo

  • Versão de lançamento: Zurich
  • Atualizado 31 de jul. de 2025
  • 2 min. de leitura
  • Personalize a aparência dos catálogos em Virtual Agent para corresponder à identidade visual da sua empresa.

    Antes de Iniciar

    Função necessária: admin, virtual_agent_admin.

    Download Construtor de temas Na ServiceNow Store e ative o plug-in (sn_theme_builder). Para obter mais informações, consulte Activate a plugin.

    Por Que e Quando Desempenhar Esta Tarefa

    Virtual Agent Usa a tabela Configuração de identidade visual [sys_cs_branding_setup] para definir cores de identidade visual, mas os catálogos não herdam cores de identidade visual. Em vez disso, os catálogos usam variáveis de folhas de estilo em cascata (CSS) definidas no registro Temas de UX [sys_ux_theme] na instância.

    Procedimento

    1. Navegar até Tudo > Temas > Construtor de temas.
    2. Crie um novo tema fornecendo cores primárias e secundárias.
      Nota:
      Você pode corresponder suas cores ao plano de fundo do cabeçalho do bate-papo e às cores do plano de fundo do bate-papo no registro de identidade visual de sua escolha. Para obter mais informações sobre como criar temas, consulte Create a theme with Theme Builder.
    3. Salve seu tema.
    4. Adicione seu tema à configuração do portal.
      1. Navegar até Tudo > Estrutura do Now Experience > Temas.
      2. Selecione o registro do tema que você deseja importar.
      3. No ícone Ações adicionais Ícone de ações adicionais., selecione Copiar sys_id .
      4. Navegar até Tudo > Portal de serviços > Bate-papo do agente.
      5. Selecione a configuração do portal na qual você deseja adicionar seu tema de identidade visual e adicione a seguinte linha ao script do servidor, incluindo o sys_id da Etapa 4c.
      Por exemplo, se o sys_id for 0be48eb1eba0011090fa99602a522843 , você adiciona:
      macroponent_theme: '0be48eb1eba0011090fa99602a522843'
    5. Adicione um tema de variante à configuração do portal, se desejado.
      1. Repita as etapas 4a e 4b.
      2. Em Composição: Tema do app , abra o desejado Style. Type. Variante .
      3. Repita os passos 4c e 4d.
      4. Selecione a configuração do portal em que você adicionou seu tema de identidade visual e adicione a seguinte linha ao script do servidor, incluindo o sys_id da Etapa 5c.
      Por exemplo, se o sys_id do tema variante for 1df59fc2fcb1122101gb00713b633954 , você adiciona:
      macroponent_theme_variant: '1df59fc2fcb1122101gb00713b633954'
    6. Selecione Atualização para salvar a configuração.
    7. Navegue até o portal em que a configuração é usada.
      Por exemplo, se você atualizou o. ESC ChatConfiguração do portal, navegue até Central de serviços do funcionário.
    8. Execute o tópico do catálogo no bate-papo do portal para carregar sua configuração e revelar todos os elementos que precisam de identidade visual.

      Virtual Agent janela de bate-papo, com links e botões realçados a serem atualizados.

    9. Navegar até Tudo > Estrutura do Now Experience > Temas > Construtor de temas.
    10. No menu suspenso, selecione Gerente , em seguida, selecione o tema criado.
    11. Em Estilos de componente , selecione Editar .

      Atualize os códigos hexadecimais de cor em Construtor de temas para corresponder às cores da sua identidade visual.

    12. Selecione um dos elementos que precisam de identidade visual encontrados na Etapa 8.
    13. Na barra lateral da paleta, defina a cor do código hexadecimal do elemento para corresponder à cor do seu registro de identidade visual.
    14. Repita as etapas 12 e 13 até atualizar todos os elementos.

      Virtual Agent janela de bate-papo, com links realçados e botões atualizados após a mudança dos códigos de cores hexadecimais em Construtor de temas.

    Resultado

    Os temas de cores do catálogo agora correspondem à sua identidade visual.