Opções do cabeçalho
O cabeçalho é a barra de navegação superior do seu site de documentação do Docsbook. Ele contém o nome e o logotipo do seu projeto, seus próprios links, ícones de redes sociais e os controles de pesquisa, Perguntar à IA, tema e idioma. Cada configuração nesta página é uma escolha de exibição — alterar o cabeçalho não custa nada do saldo do seu projeto.
Configurações do cabeçalho#
| Configuração | O que ela faz |
|---|---|
| Predefinição de layout do cabeçalho | Organiza os blocos do cabeçalho (tema, pesquisa, Perguntar à IA, links de navegação) em uma das 5 predefinições |
| Mostrar cabeçalho | Mostra ou oculta toda a barra de navegação superior |
| Links do cabeçalho | Links de texto personalizados na navegação do cabeçalho |
| Links sociais | Links com ícones para GitHub, Twitter e Discord |
| Alternador de tema no cabeçalho | Mostra o alternador de claro/escuro no cabeçalho |
| Seletor de idioma no cabeçalho | Mostra o alternador de idioma no cabeçalho |
| Botão de pesquisa no cabeçalho | Mostra um ícone/botão de pesquisa no cabeçalho |
| Cor de fundo do botão de pesquisa | Cor de fundo personalizada para o botão de pesquisa do cabeçalho — veja abaixo |
| Cor de fundo do botão Perguntar à IA | Cor de fundo personalizada para o botão Perguntar à IA do cabeçalho — veja abaixo |
Como configurar o cabeçalho#
- Abra o site da sua documentação.
- Float Widget → Design → guia Cabeçalho.
- Preencha os campos e alterne as opções.
- Salve.
Editando o cabeçalho na página#
Você também pode alterar o cabeçalho no próprio local onde ele é exibido. No seu site de documentação, pressione Editor na barra de ferramentas e clique na parte que deseja alterar:
| Clique em | Você pode |
|---|---|
| Nome ou logotipo do projeto | Alterar o nome, o logotipo ou o ícone |
| Um link do cabeçalho | Alterar o texto ou a URL, ou transformá-lo em um botão preenchido |
| Pesquisar / Perguntar à IA / idioma / tema | Ocultá-lo |
| Um ícone de rede social | Redirecioná-lo para outro lugar ou removê-lo |
| Espaço vazio na barra | Alternar a predefinição de layout |
Cada ação é enviada ao chat de IA como uma solicitação, que então a aplica — assim, você vê o que foi solicitado e o que mudou, e pode desfazê-la na mesma conversa.
Predefinições de layout do cabeçalho#
O cartão Layout do cabeçalho é o primeiro cartão na aba Cabeçalho. Ele escolhe uma disposição predefinida para os blocos na sua navegação superior — alternância de tema, pesquisa, Pergunte à IA e links de navegação — sem alterar quais blocos são exibidos.
| Predefinição | Disposição | Ideal para |
|---|---|---|
| Clássico (padrão) | Tema, Pergunte à IA e pesquisa agrupados à direita | Padrão universal — funciona para a maioria dos sites de documentação |
| Centralizado na pesquisa | Barra de pesquisa ampla centralizada no cabeçalho, Pergunte à IA à direita | Documentação com muito conteúdo, em que a pesquisa é prioritária |
| Pesquisa + Pergunte à IA | Pesquisa ampla centralizada com o botão Pergunte à IA logo ao lado | Documentação em que fazer perguntas à IA é tão importante quanto pesquisar |
| Centralizado | Logotipo à esquerda, links de navegação centralizados, utilitários à direita | Estilo página de destino com 3–5 links |
| Mínimo | Pergunte à IA e pesquisa exibidos como ícones simples | Máximo espaço para links de navegação e ícones de redes sociais |
Clique em uma predefinição para aplicá-la — um clique define todos os seis campos de posicionamento subjacentes de uma só vez (lado do tema, largura da pesquisa, posicionamento do Pergunte à IA, Pergunte à IA somente com ícone, pesquisa somente com ícone, posição dos links de navegação).
Pergunte à IA ao lado da pesquisa só tem efeito quando a barra de pesquisa é ampla. Com uma pesquisa compacta, não há um agrupamento central para o botão integrar, então ele permanece no grupo à direita.
Layout ≠ visibilidade. Uma predefinição controla apenas onde um bloco fica, nunca se ele é exibido. Se você desativar um bloco usando sua própria alternância (por exemplo, Alternância de tema no cabeçalho), esse bloco desaparecerá e o restante do cabeçalho continuará seguindo a mesma predefinição — os blocos restantes não ocuparão o lugar dele nem mudarão de disposição.
Cor de fundo dos botões do cabeçalho#
Os cartões Pesquisa no cabeçalho e Perguntar à IA no cabeçalho têm, cada um, seu próprio campo Cor de fundo, definido como um código hexadecimal (por exemplo, #5B47E0). Uma cor definida aqui substitui o fundo atenuado padrão do botão; o texto alterna automaticamente para preto ou branco para permanecer legível sobre ele.
Deixe o campo em branco para manter o fundo padrão — isso não exige que a Cor de destaque do site esteja definida, e definir uma não altera a outra.
Links do cabeçalho#
Os links do cabeçalho são links de texto personalizados na barra superior do seu site Docsbook. Adicione links que apareçam na barra superior — úteis para direcionar para seu produto, blog, changelog ou suporte.
Formato: Cada link tem um rótulo e uma URL.
Exemplo:
| Rótulo | URL |
|---|---|
| Produto | https://yourapp.com |
| Changelog | https://yourapp.com/changelog |
| Suporte | https://yourapp.com/support |
Links sociais#
Os links sociais são links com ícones no cabeçalho do Docsbook que apontam para a sua comunidade — GitHub, Twitter / X e Discord. Adicione um por plataforma.
Plataformas compatíveis:
- GitHub — links para o seu repositório ou organização
- Twitter / X — links para o seu perfil do Twitter
- Discord — links para o servidor da sua comunidade
Os links sociais aparecem como pequenos ícones no cabeçalho. Eles ajudam os leitores a encontrar a sua comunidade sem poluir a navegação com links de texto.
Controles de tema e idioma no cabeçalho#
Você pode colocar o alternador de tema e o seletor de idioma no cabeçalho em vez da barra lateral (ou além dela).
Para ter um controle mais preciso sobre onde no cabeçalho o alternador de tema e a pesquisa ficam em relação aos links de navegação, consulte acima as Predefinições de layout do cabeçalho.
Recomendação: escolha um local para cada controle para evitar duplicação.
-
Posicionamento no cabeçalho: mais visível, com menos cliques para novos visitantes.
-
Posicionamento na barra lateral: economiza espaço no cabeçalho, melhor para cabeçalhos densos.
Ocultar o cabeçalho#
Definir Mostrar cabeçalho como desativado remove toda a barra de navegação superior.
Faça isso apenas para casos de uso de incorporação ou quiosque, nos quais sua documentação é exibida dentro de outro produto. Para sites de documentação independentes, mantenha sempre o cabeçalho visível.
Relacionado#
- Layout e configuração da barra lateral — a outra metade da sua navegação
- Temas — claro, escuro, sistema — o que o seletor de tema no cabeçalho alterna
- Identidade visual — nome, logotipo, cores, fontes — o nome e o logotipo exibidos no cabeçalho
- Configurações de tradução — o que o seletor de idioma no cabeçalho oferece