Skip to main content

Fontes

Fontes

Fonte personalizável está disponível apenas nos planos Pro e Enterprise (tanto self-hosted quanto no Analytics Cloud).

Nos planos Pro e Enterprise, você pode customizar a fonte que o Analytics usa (a padrão é Lato). É possível escolher entre um conjunto selecionado de Google Fonts que contemplam os pesos regular, bold e heavy, utilizados em vários elementos da interface do Analytics.

Fontes inclusas

Para alterar a fonte do Analytics, clique no ícone de engrenagem no canto superior direito da tela e selecione Configurações do administrador > Configurações > Aparência. Em Fonte, escolha entre uma lista de fontes inclusas.

Comic Sans atualmente não está incluída.

Fontes customizadas

Para configurar uma fonte customizada, clique no ícone de engrenagem no canto superior direito da tela e selecione Configurações do administrador > Configurações > Aparência.

Em Fonte, escolha Custom... e insira as URLs dos seus arquivos de fonte.

Opções de estilo da fonte

Você pode configurar três estilos diferentes para a fonte, com três URLs distintas, uma para cada estilo (tamanho e peso) que o Analytics usará para exibir corretamente sua interface. Os pesos são:

  • Regular 400
  • Bold 700
  • Heavy 900 (às vezes chamado de Black 900)

É necessário configurar ao menos o primeiro estilo (Regular 400); o navegador preencherá os demais.

Para melhor resultado, configure pelo menos os estilos 400 e 700. Se você tiver um único arquivo de fonte que contenha múltiplos estilos da mesma família, insira a URL nos vários campos para informar ao Analytics que deve preferir esses pesos no arquivo. Isso fará com que os estilos da fonte sobrescrevam os estilos padrões do navegador.

Formatos de arquivo de fonte suportados

O Analytics suporta arquivos customizados nos formatos woff, woff2 e ttf. Se a URL fornecida não possuir extensão, o sistema assumirá que é um arquivo woff2.

URLs de Google Fonts

Para obter uma URL para uma Google Font, acesse a página da fonte no Google Fonts e selecione o estilo desejado. Em seguida, faça uma requisição HTTP para obter a URL do arquivo ttf. Por exemplo, para usar a fonte Roboto Mono, veja como obter os arquivos das versões 400 e 700:

Você pode colar a URL https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;700&display=swap na barra de endereços do navegador. Essa URL retornará um conteúdo como:

@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/robotomono/v21/L0xTDF4xlVMF-BfR8bXMIhJHg45mwgGEFl0_3vrtSM1J-gEPT5Ese6hmHSV0me8iUI0lkQ.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/robotomono/v21/L0xTDF4xlVMF-BfR8bXMIhJHg45mwgGEFl0_3vrtSM1J-gEPT5Ese6hmHSx0me8iUI0lkQ.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
...

Para texto em latim, copie as URLs src relevantes para cada estilo, por exemplo:

Então cole essas URLs nos campos correspondentes em Configurações do administrador > Configurações > Aparência > seção Fonte onde está escrito “Informe onde encontrar os arquivos para cada peso. Não é obrigatório incluir todos, mas o visual fica melhor caso faça.”

Hospedando fontes no GitHub

Se você hospedar uma fonte no GitHub, ela deve estar em um repositório público, e você precisará linkar diretamente para o arquivo de fonte público servido pelo domínio raw.githubusercontent.com.

Por exemplo, para usar a fonte Inter, o arquivo está disponível em:

https://github.com/rsms/inter/blob/master/docs/font-files/Inter-Regular.woff2

https://raw.githubusercontent.com/rsms/inter/master/docs/font-files/Inter-Regular.woff2

raw.githubusercontent.com/${user}/${repo}/${branch}/${path}

Suporte a múltiplos idiomas

Para dar suporte a múltiplos conjuntos de caracteres, como Latim e Cirílico, você precisará fazer a junção (merge) dos arquivos de fontes.

Customizando a fonte para itens embutidos individuais

Além das fontes inclusas, se você configurar uma fonte customizada para o seu Analytics, essa fonte estará disponível para seleção em “Usar fonte da instância” em embeds estáticos.

Leitura complementar

Leia a documentação para outras versões do Analytics.

Back to top