Configurar identidade visual do portal

  • Versão de lançamento: Xanadu
  • Atualizado 1 de ago. de 2024
  • 2 min. de leitura
  • Use Editor da Identidade Visual para dar ao seu portal uma aparência própria.

    Para acessar o Editor de identidade visual, navegue até Portal de serviços > Configuração do Portal de serviçose clique em Editorde 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 da 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. Alterar o nome do portal no Editor da Identidade Visual també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 até a borda do cabeçalho. Essas informações são armazenadas na seção de variáveis CSS no formulário do portal.
    Linha de marcador e plano de fundo

    Campos definidos pelo esquema JSON no campo Configuração de início rápido no registro do portal na IU da plataforma. A amostra Portal de serviços adiciona linha de marcador e plano de fundo a Editor da Identidade Visual usando 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 seus usuários a uma página do portal com um slogan. Este texto é armazenado em uma instância do widget de pesquisa da página inicial.
    Cor da linha do marcador Selecione uma cor para o slogan.
    Cor de plano de fundo da página inicial Adicione uma cor ao 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 na sua página inicial.
    Para todas as cores na guia do tema, você pode usar o nome da cor padrão, código hexadecimal, código decimal (RGB) ou selecionar a cor na paleta de cores. Todas as definições de cores são armazenadas no campo de 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 do 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.

    As mudanças feitas nas cores do tema em Editor da Identidade Visual aparecem no campo de variáveis CSS do formulário do portal na IU da plataforma.