Personalizar o estilo das páginas do portal do desenvolvedor

Há três maneiras mais comuns de personalizar o portal do desenvolvedor no Gerenciamento de API do Azure:

• Editar o conteúdo de páginas estáticas e elementos de layout da página
• Atualizar os estilos usados para elementos de página entre o portal do desenvolvedor (explicado neste guia)
• Modificar os modelos usados para as páginas geradas pelo portal (por exemplo, documentos de API, produtos, autenticação do usuário)

Neste artigo, você aprenderá a personalizar o estilo de elementos em páginas do portal do desenvolvedor herdado e exibir suas alterações.

Observação

O conteúdo da documentação a seguir é sobre o portal do desenvolvedor preterido. Você pode continuar usando-o, como de costume, até a desativação dele em outubro de 2023, quando ele será removido de todos os serviços de Gerenciamento de API. O portal preterido receberá apenas atualizações de segurança críticas. Veja os seguintes artigos para obter mais detalhes:

• Saiba como migrar para o novo portal do desenvolvedor
• Visão geral do novo portal do desenvolvedor do Gerenciamento de API do Azure
• Acessar e personalizar o novo portal do desenvolvedor

Disponibilidade

Importante

Este recurso está disponível nas camadas Premium, Standard, Básico e Desenvolvedor do Gerenciamento de API.

Para obter a disponibilidade de recursos nas camadas v2 (versão prévia), consulte a visão geral das camadas v2.

Pré-requisitos

• Conheça a terminologia do Gerenciamento de API do Azure.
• Conclua o seguinte guia de início rápido: Criar uma instância do Gerenciamento de API do Azure.
• Além disso, conclua o seguinte tutorial: Importar e publicar sua primeira API.

Personalizar o portal do desenvolvedor

1. Selecione Visão geral.

2. Clique no botão Portal do desenvolvedor (herdado) na parte superior da janela Visão geral.

3. No canto superior esquerdo da tela, você verá um ícone composto de dois pincéis. Passe o mouse sobre esse ícone para abrir o menu de personalização do portal.

   

4. Selecione Estilos no menu para abrir o painel de personalização de estilos.

   Todos os elementos que você pode personalizar usando Estilos aparecem na página

5. Insira "headings-color" no campo Alterar valores de variáveis para personalizar a aparência do portal do desenvolvedor: .

   O elemento @headings-color aparece na página. Essa variável controla a cor do texto.

   

6. Clique no campo da variável @headings-color.

   A lista suspensa do seletor de cores é aberta.

7. Selecione uma nova cor na lista suspensa do seletor de cores.

   Dica

   A visualização em tempo real está disponível para todas as alterações. Um indicador de progresso aparece na parte superior do painel de personalização. Depois de alguns segundos, o texto do cabeçalho muda para a cor selecionada.

8. Selecione Publicar no canto inferior esquerdo do menu do painel de personalização.

9. Selecione Publicar personalizações para disponibilizar as alterações publicamente.

Exibir as alterações

1. Navegue até o portal do desenvolvedor.
2. Você pode ver a alteração feita.

Próximas etapas

Talvez você também esteja interessado em saber como personalizar o portal de desenvolvedor de Gerenciamento de API do Azure usando modelos.