Docsbook
Visão geral

Identidade visual

A identidade visual é onde um site de documentação do Docsbook utiliza o nome, o logotipo, a cor de destaque e as fontes do seu produto. Dois dos campos desta página não são cosméticos: URL da chamada para ação e Preço médio do produto são o que permite que a análise de dados registre conversões e receita.

Configurações de branding#

Campo O que faz
Nome personalizado Nome de exibição mostrado na aba do navegador e no cabeçalho
URL da chamada para ação A página para a qual sua documentação deve direcionar os leitores — veja abaixo
Preço médio do produto Quanto vale uma conversão, para que as análises possam informar a receita — veja abaixo
Cor de destaque Cor de marca principal aplicada a botões, links e destaques
Fonte dos títulos Fonte do Google usada nos títulos (h1–h6)
Fonte do conteúdo Fonte do Google usada no texto do corpo — usa a fonte dos títulos como alternativa

Como aplicar a identidade visual#

  1. Abra o site da sua documentação.
  2. Widget flutuante → aba Design → aba Identidade visual.
  3. Preencha os campos.
  4. Clique em Salvar.

As alterações são aplicadas instantaneamente — não é necessário recompilar.

URL da chamada para ação#

Sua URL da chamada para ação é a página para a qual sua documentação existe para direcionar as pessoas: sua página de preços, um agendamento de demonstração ou uma inscrição. Defina-a uma vez e três coisas começarão a usá-la:

  • Seu chat de IA direciona os leitores para lá quando eles estão avaliando, comparando ou perguntando sobre planos — e não interfere quando a pergunta é sobre uma simples solução de problemas.
  • Geração de conteúdo trata essa página como o objetivo do site, para que as páginas terminem com um próximo passo em vez de um beco sem saída, e a IA possa adicioná-la ao cabeçalho como um botão.
  • Analytics contabiliza como conversão um leitor que sai para esse domínio. É isso que transforma o cartão Conversas de "os leitores saíram da documentação" em "os leitores chegaram à página que vende", e é isso que a métrica Taxa de conversão no topo do painel de analytics mede.

Insira um endereço completo de https://. A correspondência é feita por domínio, portanto cada caminho nele é contabilizado, e strings de consulta ou tags UTM são aceitas. Deixe vazio se você ainda não tiver nada para vender — nada será interrompido, mas você perderá a coluna de objetivo no analytics.

Se você definiu isso ao criar sua primeira documentação, o campo já estará preenchido aqui.

Preço médio do produto#

Seu Preço médio do produto é o valor médio de uma conversão para você — o preço de um plano, o valor típico de um pedido, ou o valor que um leitor que chega à sua página de chamada para ação representa depois que compra.

Defina-o e o painel de análise começará a informar Receita e Receita por visitante: os leitores que clicaram na sua URL de chamada para ação, multiplicados por esse número.

Insira-o em dólares — 299 ou 29.90, com ou sem o $. Ele funciona em conjunto com a URL de chamada para ação acima, e ambos são necessários: um informa qual clique conta, o outro informa quanto ele vale. Defina apenas um e os valores de receita permanecerão desativados, informando qual metade ainda está faltando.

Deixe-o vazio para desativar novamente os relatórios de receita. Não há como inserir 0 — um preço médio igual a zero deixaria os valores parecendo ativados enquanto informaria $0 para sempre, o que é pior do que um campo vazio honesto.

Cor de destaque#

A cor de destaque de um site Docsbook é um código hexadecimal (por exemplo, #5B47E0). Ela afeta:

  • Estados ativos na barra lateral
  • Interruptores
  • Botões
  • Links

Escolha uma cor que corresponda à cor principal da marca do seu produto. Evite cores muito claras — elas não atenderão aos requisitos de contraste em fundos brancos.


Fontes#

Escolha a tipografia do seu site de documentação entre mais de 1500 Google Fonts. Os títulos e o texto do corpo são definidos separadamente, para que você possa combinar uma fonte de destaque diferenciada com uma fonte para o corpo altamente legível.

Campos: Headings, Content

Como definir as fontes:

  1. Float Widget → cartão DesignFont.
  2. Escolha uma fonte em Headings — isso estiliza h1–h6.
  3. Opcionalmente, escolha uma fonte diferente em Content — isso estiliza o texto do corpo.
  4. Salve.

Deixar Content vazio significa que o texto do corpo usará a fonte dos títulos, portanto uma única escolha ainda estiliza a página inteira. Cada seletor tem uma caixa de pesquisa e mostra uma prévia de cada família na própria fonte. Reset limpa um campo.

As fontes são carregadas automaticamente do Google Fonts — não há nada para instalar ou hospedar.


Ícones personalizados#

Defina um favicon e um ícone de cabeçalho personalizados para o seu site de documentação.

Campo: Icon URL

Como definir um ícone:

  1. Float Widget → separador DesignBranding.
  2. Cole um URL público para a imagem do ícone no campo Icon URL.
  3. Guarde.

Requisitos do ícone:

  • Utilize uma imagem quadrada — recomenda-se PNG ou SVG.
  • Tamanho ideal: 64×64 px (PNG) ou qualquer tamanho (SVG).
  • O URL deve estar acessível publicamente (sem autenticação necessária).

Onde o ícone aparece:

  • Favicon do navegador (ícone do separador)
  • Área do logótipo do cabeçalho na barra lateral da documentação

Esta página foi útil?