Aula 13: Configurando cabeçalho

Configurar o cabeçalho no tema Astra é um processo simples, pois o Astra oferece várias opções personalizáveis diretamente no Personalizador de Tema. Você pode alterar o logo, a estrutura do menu, o estilo do cabeçalho e muito mais. Aqui está um passo a passo para personalizar o cabeçalho no tema Astra:

1. Acessar o Personalizador do Tema Astra:

• Faça login no painel do WordPress (seusite.com/wp-admin).
• No menu lateral esquerdo, vá até Aparência > Personalizar. Isso abrirá o Personalizador de Tema do Astra.

2. Configurar o Cabeçalho:

No Personalizador, você encontrará várias opções relacionadas ao cabeçalho. Aqui estão as principais seções que você pode configurar:

a. Identidade do Site (Logo e Título):

1. Identidade do site:
   • No Personalizador, clique em “Identidade do Site”.
   • Aqui, você pode:
     • Alterar o logo: Selecione ou envie uma imagem para ser usada como logo do seu site.
     • Editar o título e o slogan: Se você não usar um logo ou quiser mostrar o nome do site junto com o logo, você pode editar o título do site e o slogan.

b. Layout do Cabeçalho:

1. Layout do cabeçalho:
   • Vá para Cabeçalho > Layout.
   • Aqui você pode escolher entre diferentes opções de layout do cabeçalho, como:
     • Layout padrão (com logo e menu).
     • Cabeçalho com logo à esquerda e menu à direita.
     • Cabeçalho com o logo no centro e o menu abaixo ou acima.
     • Cabeçalho dividido, onde o logo pode estar à esquerda e o menu à direita (ou vice-versa).
2. Escolher o estilo do cabeçalho:
   • Você também pode escolher um estilo de cabeçalho mais limpo e minimalista, dependendo do tema e da sua preferência de design.

c. Configurações do Menu de Navegação:

1. Configurar o menu principal:
   • Vá para Aparência > Menus e crie o seu menu principal, que será exibido no cabeçalho. Lembre-se de associá-lo à localização correta (geralmente “Menu Principal” ou “Menu do Cabeçalho”).
   • Depois de criar o menu, volte ao Personalizador e acesse Cabeçalho > Menu de Navegação. Aqui você pode:
     • Alterar o alinhamento do menu (à esquerda, no centro ou à direita).
     • Definir o tamanho da fonte do menu.
     • Definir a cor de fundo ou de texto do menu.
     • Ativar ou desativar a animação de menu (se disponível).

d. Opções de Cor e Tipografia:

1. Cor do Cabeçalho:

   • Vá para Cabeçalho > Cores.
   • Você pode alterar a cor de fundo do cabeçalho, a cor do texto e até a cor dos links do menu de navegação. Isso permite personalizar as cores de acordo com a identidade visual do seu site.

2. Tipografia:

   • Vá para Cabeçalho > Tipografia.
   • Personalize as fontes usadas no cabeçalho, como a fonte do logo e o estilo das fontes do menu de navegação. Você pode escolher entre várias fontes integradas ou usar o Google Fonts.

e. Adicionar ou Remover Elementos no Cabeçalho (como botão de chamada para ação):

1. Adicionar um botão de ação no cabeçalho:
   • Se você quiser adicionar um botão de chamada para ação (como “Comprar Agora”, “Contato”, etc.), vá para Cabeçalho > Botão (essa opção pode variar dependendo do tema).
   • Aqui você pode personalizar o texto do botão, adicionar um link para onde ele deve direcionar e escolher a cor do botão.

f. Altura do Cabeçalho:

1. Altura do cabeçalho:
   • Para ajustar a altura do cabeçalho, acesse Cabeçalho > Altura.
   • Aqui, você pode definir a altura do cabeçalho para garantir que ele tenha a aparência desejada, ajustando a altura do logo e da área do menu.

3. Visualizar e Salvar as Alterações:

• Depois de fazer todas as alterações desejadas no cabeçalho, clique em “Publicar” no topo do Personalizador para salvar as modificações.
• Você pode visualizar as alterações em tempo real, o que facilita ajustar o layout até que fique como você deseja.

4. Verificar no Front-End:

• Após salvar as alterações, acesse o seu site para verificar como o cabeçalho ficou na página inicial e em outras páginas.

Dicas adicionais:

• Cabeçalho fixo ou sticky: Se você quiser que o cabeçalho permaneça visível enquanto o usuário rola a página, você pode ativar a opção de cabeçalho fixo ou sticky header nas configurações do Astra, se estiver disponível. Isso é útil para melhorar a navegação, pois o menu estará sempre acessível.

• Compatibilidade com o Elementor: Se você estiver usando o Elementor para criar páginas, você pode usar widgets adicionais para personalizar ainda mais o cabeçalho, incluindo formulários, botões ou outros elementos.

O tema Astra oferece uma enorme flexibilidade para personalizar o cabeçalho sem precisar de código. Com essas opções, você consegue ajustar o cabeçalho do seu site de forma simples e eficaz.