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#
- Abra o site da sua documentação.
- Widget flutuante → aba Design → aba Identidade visual.
- Preencha os campos.
- 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:
- Float Widget → cartão Design → Font.
- Escolha uma fonte em Headings — isso estiliza h1–h6.
- Opcionalmente, escolha uma fonte diferente em Content — isso estiliza o texto do corpo.
- 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:
- Float Widget → separador Design → Branding.
- Cole um URL público para a imagem do ícone no campo Icon URL.
- 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
Relacionados#
- Temas — claro, escuro, sistema — o tema sobre o qual sua cor de destaque é aplicada
- Layout do cabeçalho e navegação — onde aparecem o nome, o logotipo e o ícone
- Visão geral da análise — os valores de Receita e Conversão que estes dois campos ativam