Configurar identidade visual do portal

  • Versão de lançamento: Zurich
  • Atualizado 31 de jul. de 2025
  • 2 min. de leitura
  • Usar Editor de identidade visualpara dar ao seu portal sua própria aparência.

    Para acessar o Editor de identidade visual, navegue até Portal de serviços > Configuração do Portal de serviçose clique em Editor de identidade visual .

    Selecione o portal para o qual você deseja personalizar o tema na lista de portais. Em seguida, use as opções nas guias Configuração rápida e Cores do tema para personalizar seu portal.

    Figura 1. Editor de identidade visual
    Editor da Identidade Visual
    Tabela 1. Opções da guia Configuração rápida
    Campo Descrição
    Título do portal

    O nome do seu portal. Alterando o nome do portal no Editor de identidade visualTambém muda o título no campo de formulário do portal na IU da plataforma.

    Logotipo O logotipo que aparece no cabeçalho do seu portal. Esta imagem é dimensionada para uma altura máxima de 46 px e uma largura máxima de 200 px.
    Preenchimento do logotipo Onde você deseja que o logotipo fique no local da borda do cabeçalho. Essas informações são armazenadas na seção Variáveis CSS no formulário do portal.
    Marcador e plano de fundo

    Campos definidos pelo esquema JSON no Configuração de início rápido Campo no registro do portal na IU da plataforma. A amostra Portal de serviços adiciona Slogan e. Plano de fundo para Editor de identidade visualusando o seguinte esquema:

    [{
    	"tagline": {
    		"table" : "sp_instance",
    		"sys_id" : "34fe3d96cb20020000f8d856634c9cf4",
    		"field" : "title"
    	},
    	"hero_background": {
    		"table" : "sp_container",
    		"sys_id" : "be98a8d2cb20020000f8d856634c9c63",
    		"field" : "background_image"
    	}
    }]
    Slogan Apresente aos usuários uma página do portal com um marcador. Este texto é armazenado em uma instância do widget de pesquisa da página inicial.
    Cor do marcador Selecione uma cor para o marcador.
    Cor de plano de fundo da página inicial Adicione uma cor para o plano de fundo. Você pode digitar um nome de cor, cor hexadecimal, decimal (RGB) ou selecionar na paleta de cores.
    Imagem em segundo plano Carregue uma imagem para aparecer no plano de fundo da sua página inicial. Esta imagem é armazenada no contêiner do widget em sua página inicial.
    Para todas as cores na guia Tema, você pode usar o nome da cor padrão, o código hexadecimal, o código decimal (RGB) ou selecionar a cor na paleta de cores. Todas as definições de cor são armazenadas no campo Variáveis CSS do formulário do portal. A visualização do tema é atualizada em tempo real conforme você faz mudanças.
    Tabela 2. Guia Cores do tema
    Campo Descrição
    Barra de navegação Use os campos nesta seção para personalizar as cores do menu de cabeçalho.
    Marca Use os campos nesta seção para personalizar as cores da página. Por exemplo, o plano de fundo da página ou o plano de fundo do widget.
    Texto Use os campos nesta seção para personalizar a cor do texto em uma página.

    Mudanças feitas nas cores do tema no Editor de identidade visualAparece no campo Variáveis CSS do formulário do portal na IU da plataforma.