Personalizar a identidade visual neutra no seu locatário externo

Aplica-se a: Locatários da força de trabalho Locatários externos (saiba mais)

Depois de criar um novo locatário externo, você pode personalizar a experiência do usuário final. Crie uma aparência personalizada para os usuários que entram em seus aplicativos, definindo as configurações da Identidade Visual da Empresa no seu locatário. Com essas configurações, você pode adicionar suas próprias imagens de plano de fundo, cores, logotipos da empresa e texto para personalizar as experiências de entrada em seus aplicativos.
Você também pode criar fluxos de usuário programaticamente usando a API do Grafo de Identidade Visual da Empresa.

Dica

Para experimentar esse recurso, acesse a demonstração Woodgrove Groceries e inicie o caso de uso "Identidade visual da empresa".

Pré-requisitos

• Se você ainda não criou seu próprio locatário externo do Microsoft Entra, crie um agora.
• Registrar um aplicativo.
• Criar um fluxo de usuário
• Examine os requisitos de tamanho do arquivo para cada imagem que você deseja adicionar. Talvez seja necessário usar um editor de fotos para criar as imagens de tamanho certo. O tipo de imagem preferencial para todas as imagens é PNG, mas JPG é aceito.

Elementos de identidade visual

Por padrão, a Microsoft oferece uma identidade visual neutra para seu locatário que pode ser personalizada para atender aos requisitos específicos da sua empresa. Essa identidade visual padrão não inclui nenhuma identidade visual preexistente da Microsoft. Se a identidade visual personalizada da empresa não for carregada, a página de entrada voltará automaticamente para essa identidade visual neutra. Além disso, cada propriedade de identidade visual personalizada pode ser adicionada manualmente à página de entrada personalizada.

Você pode personalizar essa identidade visual neutra com uma imagem ou cor de plano de fundo personalizada, favicon, layout, cabeçalho e rodapé. Você também pode personalizar o formulário de entrada e adicionar texto personalizado a diferentes instâncias ou fazer upload de um CSS personalizado. A imagem a seguir exibe a identidade visual padrão neutra do locatário. Você pode encontrar os elementos de identidade visual numerados e suas descrições correspondentes após a imagem.

1. Plano de fundo neutro.
2. Favicon.
3. Logotipo do banner.
4. Rodapé como um elemento de layout da página.
5. Hiperlinks de rodapé, como Cookies e privacidade, Termos de uso.

Como personalizar a experiência de entrada padrão

Antes de personalizar as configurações, a identidade visual padrão neutra aparece nas páginas de entrada, inscrição e saída. Você pode personalizar essa experiência padrão com uma imagem de plano de fundo personalizada ou cor, favicon, layout, cabeçalho e rodapé. Você também pode carregar um CSS personalizado .

1. Entre no centro de administração do Microsoft Entra como, no mínimo, um Administrador de Identidade Visual Organizacional.

2. Se você tiver acesso a vários locatários, use o ícone de Configurações no menu superior para alternar para o locatário externo que você criou anteriormente no menu Diretórios + assinaturas.

3. Navegue até Identidade Visual da Empresa usando a barra de pesquisa ou navegando até Página Inicial>Visão geral do locatário>Personalizar identidade visual.

   

4. Na guia Credenciais padrão, selecione Editar.

   

Para personalizar a tela de fundo e o layout da página de entrada

1. Na guia Básico, modifique qualquer um dos elementos da tela de fundo.

   • Favicon – O ícone que aparece na aba do navegador.

   • Imagem da tela de fundo – A imagem grande exibida na página de entrada. Se você carregar uma imagem, ela será dimensionada e recortada para preencher a janela do navegador.

   • Cor da tela de fundo da página – a cor que substitui a imagem de plano de fundo sempre que a imagem não puder ser carregada, por exemplo, devido à latência da conexão.

   

2. Selecione Avançar: Layout se quiser continuar personalizando ou Rever e salvar se quiser salvar suas alterações.

3. Na guia Layout, selecione o posicionamento dos elementos da página da web na página de login.

   • Modelo – escolha se a tela de fundo exibe tela inteira ou tela parcial.

   • Cabeçalho – Mostrar ou ocultar o cabeçalho.

   • Rodapé – Mostre ou oculte o rodapé.

   • CSS Personalizado – Carregue seu próprio arquivo CSS para substituir o estilo padrão da Microsoft por seu próprio estilo para: cor, fonte, tamanho do texto, posição dos elementos e exibições para diferentes dispositivos e tamanhos de tela.

   

4. Selecione Avançar: Cabeçalho, se você quiser continuar personalizando, ou Examinar e salvar, se quiser salvar suas alterações.

Para personalizar o logotipo, o link de privacidade e os termos de uso

1. Na guia Cabeçalho, selecione o logotipo a ser exibido no cabeçalho da página de entrada.

   

2. Selecione Avançar: Rodapé, se você quiser continuar personalizando, ou Examinar e salvar, se quiser salvar suas alterações.

3. Na guia Rodapé, você pode personalizar as URLs e vincular o texto para os hiperlinks de privacidade e termos de uso exibidos no rodapé da página de entrada.

   • Privacidade e Cookies – Marque a caixa de seleção ao lado de Privacidade e Cookies para exibir esse hiperlink no rodapé. O link de privacidade padrão da Microsoft é exibido, a menos que você insira seu próprio texto e URL de exibição de hiperlink.

   • Termos de Uso – marque a caixa de seleção ao lado dos Termos de Uso para exibir esse hiperlink no rodapé. O link de termos de uso da Microsoft é exibido, a menos que você insira seu próprio texto e URL de exibição de hiperlink.

   

4. Selecione Avançar: Formulário de entrada, se você quiser continuar personalizando, ou Examinar e salvar, se quiser salvar suas alterações.

Para personalizar o formulário de login

1. Na guia Formulário de entrada, configure os elementos do formulário de entrada:

   • Logo do Banner – é exibido na página de login e no painel de acesso do usuário.

   • logotipo quadrado (tema claro) – Representa contas de usuário em sua organização.

   • logotipo quadrado (tema escuro) – se o logotipo quadrado do tema claro for exibido mal em planos de fundo escuros, você poderá carregar um logotipo para ser usado em seu lugar quando planos de fundo escuros forem usados.

   

2. Role até a metade inferior da página e configure mais elementos do formulário de entrada:

   • Texto de dica de nome de usuário – O texto de dica que é exibido no campo de entrada de nome de usuário na página de entrada (não é recomendável se usuários convidados entrarem no seu aplicativo).

   • Texto da página de entrada – Exibido na parte inferior das páginas de entrada e inscrição. Diretrizes:

     • Máximo de 1.024 caracteres
     • Não inclua informações confidenciais
     • Use essa sintaxe para formatar o texto:
       • Hiperlink: [text](link)
       • Negrito: **text** or __text__
       • Itálico: *text* or _text_
       • Sublinhado: ++text++

Para personalizar a redefinição de senha self-service

1. Role até a seção Redefinição de senha self-service para configurar opções para mostrar, ocultar ou personalizar o link de redefinição de senha self-service na página de entrada.

   • Mostrar opção de redefinição de senha de autoatendimento – marque esta caixa de seleção para exibir o link de redefinição de senha de autoatendimento.
   • URL Comum: insira uma URL de redefinição de senha a ser usada em substituição ao link padrão da Microsoft.
   • Texto de exibição da coleção de contas – insira o texto do link a ser exibido no lugar do texto padrão da Microsoft "Não consegue acessar a sua conta".
   • Texto de exibição da coleção de senhas – insira o texto do link a ser exibido no lugar do texto padrão "Senha esquecida" da Microsoft.

   

2. Selecione Próximo: Texto se quiser continuar personalizando ou Revisar + salvar se quiser salvar suas alterações.

Para personalizar atributos de usuário

Para seu locatário, você pode ter requisitos diferentes para as informações que deseja coletar durante a inscrição e a entrada. O locatário vem com um conjunto interno de informações armazenadas em atributos, como Nome Fornecido, Sobrenome, Cidade e Cep. Você pode criar atributos personalizados em seu locatário utilizando a API do Microsoft Graph ou no portal na guia Texto em Identidade Visual da Empresa.

1. Na guia Texto, selecione Adicionar Texto Personalizado.

2. Selecione qualquer uma das opções:

   • Selecione Atributos para substituir os valores padrão.
   • Selecione o conjunto de atributos para adicionar uma nova opção de atributo que você gostaria de coletar durante o processo de inscrição.
   • Selecione Entrar para adicionar um texto personalizado na página de entrada.
   • Selecione Cadastre-se para adicionar texto personalizado para a página de login.
   • Selecione SISU OTC (Entrar/inscrever-se com código único) para adicionar um título personalizado.

   

3. Selecione Avançar: revise para examinar todas as suas modificações. Em seguida, selecione Salvar se quiser salvar suas alterações ou Anterior se quiser continuar personalizando.

Importante

No locatário externo, temos duas opções para adicionar texto personalizado à experiência de cadastro e login. A função está disponível em cada fluxo de usuário durante a personalização do idioma e também na identidade visual da empresa. Embora tenhamos duas maneiras de personalizar cadeias de caracteres (via Identidade Visual da Empresa e por meio de Fluxos de Usuário), ambas as maneiras modificam o mesmo arquivo JSON. A alteração mais recente feita por meio de fluxos de usuário ou por meio da identidade visual da Empresa sempre substituirá a anterior.

Personalizar a experiência de encerramento de sessão

Você não precisa personalizar a experiência de saída para seu locatário externo. Se você tiver personalizado sua identidade visual para a experiência de entrada, a experiência de saída corresponderá automaticamente à experiência de entrada. Se você não tiver personalizado a experiência de entrada, a experiência de saída corresponderá à identidade visual neutra padrão em seu locatário externo.

Como personalizar o nome do locatário

Você pode personalizar o nome do locatário no Centro de administração do Microsoft Entra para substituir o logotipo da faixa da Microsoft na experiência de entrada padrão neutra. O novo nome do locatário também aparece no email de verificação enviado ao usuário.

1. Entre no centro de administração do Microsoft Entra como, no mínimo, um Administrador de Identidade Visual Organizacional.

2. Se você tiver acesso a vários locatários, use o ícone de Configurações na parte superior do menu para alternar para o locatário externo que você criou anteriormente no menu Diretórios + assinaturas .

3. Na barra de pesquisa, digite e selecione Propriedades do locatário.

4. Edite o campo Nome.

   

5. Selecione Salvar.

Personalizar sua identidade visual com a API do Microsoft Graph

Você pode usar a API do Microsoft Graph para personalizar alguns itens programaticamente. Por exemplo, você pode usar a API para carregar uma imagem de plano de fundo personalizada, alterar a cor da página de entrada e adicionar um logotipo personalizado. Para obter mais informações, confira o artigo atualizar a identidade visual padrão.

Conteúdo relacionado

Neste artigo, aprendemos a personalizar a aparência da experiência de entrada e inscrição do cliente. Para obter mais informações sobre a personalização do idioma do locatário, confira o artigo Personalização do idioma. Para entender as diferenças na identidade visual dos locatários da força de trabalho, consulte o artigo Como personalizar a identidade visual de sua força de trabalho.