Substitua ilustrações de ícone por imagens personalizadas

Modifique ou substitua as ilustrações de ícone padrão por suas próprias imagens personalizadas para promover elementos visuais que reflitam a identidade visual da sua empresa. Quando você substitui um ícone, Construtor de temas atualiza o ícone sempre que ele for usado na interface.

Antes de Iniciar

Função necessária: ui_builder_admin

Para obter informações sobre funções granulares, consulte Granular admin roles.

Por Que e Quando Desempenhar Esta Tarefa

Quando você substitui a imagem de base, Construtor de temas cria os outros tamanhos de ícone redimensionando sua nova imagem base automaticamente. Isso significa que você só precisa manter um arquivo de origem, e. Construtor de temas mantém todos os tamanhos sincronizados para você. Se os tamanhos gerados automaticamente perderem nitidez ou detalhes importantes, você poderá substituir qualquer tamanho independentemente.

Você pode substituir todo um conjunto de ícones por meio de uma única imagem base ou fornecer ativos específicos de tamanho para controle preciso.

Use a substituição da imagem de base quando:

• Você quer mover-se rapidamente com uma única fonte de verdade.
• Pequenas mudanças do dimensionamento são aceitáveis.

Use substituições por tamanho quando:

• Você precisa de espessuras de traço uniformes em todos os tamanhos.
• Os detalhes finos se perdem em 12 x 12 ou 16 x 16, e você quer arte simplificada em tamanho pequeno
• Sua equipe de design mantém um conjunto de ícones personalizado de acordo com o tamanho.

Importante:

As imagens personalizadas se aplicam aos espaços de trabalho e não são compatíveis com IU principal.

Procedimento

1. Navegar até Tudo > Estrutura do Now Experience > Construtor de temas.
   . Construtor de temas A página principal é aberta em uma nova guia e exibida na exibição da página inicial.
2. Use a lista suspensa Página para selecionar a exibição da página do Editor.

   Figura 1. Exibição da página do editor

   

3. Na lista suspensa Tema, selecione o tema que você deseja editar.
4. Selecione Estilos de imagem no painel estilos gerais e expanda Ícones .
5. Use uma das opções a seguir para selecionar o conjunto de ilustrações de ícones que você deseja substituir.
   • Selecione o ícone Filtro e expanda a categoria de ícone para selecionar o conjunto de ilustrações específico que você deseja substituir. Habilitar Mostrar somente imagens modificadas para exibir somente os ícones que você alterou.
   • Insira texto no campo de pesquisa para filtrar a biblioteca de ícones. Os resultados são atualizados à medida que você insere e mostra ícones padrão e personalizados correspondentes disponíveis na biblioteca de ícones do tema.
   • Percorra a lista de ilustrações de ícones na fase principal. Use o controle de registros por página para exibir 10, 20, 50 ou 100 ícones de cada vez enquanto navega.
   Depois de selecionar uma ilustração, o painel de propriedades será aberto.

   Figura 2. Guia Estilos de imagem com ícones expandidos

   

6. No painel de propriedades, selecione o nome do arquivo para o tamanho do ícone que você deseja substituir.
   Nota:

   Para atualizar todos os tamanhos, substitua a imagem de base. A substituição de outros tamanhos afeta somente esse tamanho. Se você substituir a imagem de base, todos os tamanhos menores serão redimensionados automaticamente e todas as substituições de tamanho individual já aplicadas serão substituídas.
7. Use uma das seguintes opções para carregar sua imagem personalizada:
   • Selecione Procurar , escolha seu arquivo de imagem personalizada no navegador de arquivos do computador e selecione Aberto .
   • Arraste o arquivo de imagem personalizada do navegador de arquivos do seu computador e solte a imagem diretamente no modal.
   Consulte o modal de carregamento de imagem para obter limitações de tamanho e formato ou consulte Ilustrações de ícone em Construtor de temas. Se sua imagem personalizada não atender ao tamanho e ao formato necessários, sua imagem não será salva.
8. Visualize sua imagem no modal e selecione Salvar .
   Sua imagem personalizada aparece na fase principal no tipo de ilustração de ícone que você escolheu. O nome do arquivo da sua imagem personalizada agora está listado no painel de propriedades.
9. Opcional: Selecione o ícone Remover substituição para restaurar a ilustração do ícone padrão.
   Nota:

   A remoção da substituição da imagem de base redefine o ícone para seu estado padrão e limpa todas as substituições de tamanho individual.
10. Visualize suas edições antes de publicar seu tema em sua instância.

    A escala de ícone pode introduzir problemas de nitidez ou detalhe que só são visíveis em uma experiência ao vivo.

    1. Selecione . No painel Estilos globais.
    2. Selecione a experiência que você deseja visualizar na lista suspensa Experiência.
    3. Selecione o ícone Abrir em uma nova guia para abrir a experiência em uma nova guia.

       Figura 3. Visualização da experiência

       

Resultado

Se o seu tema for publicado, suas imagens personalizadas ficarão visíveis para os usuários que têm seu tema aplicado na atualização. Para obter mais informações sobre como publicar temas, consulte Publique seus temas com Construtor de temas.