Quer saber como editar a barra de navegação no WordPress?
Embora o tema do WordPress controle a aparência dos menus de navegação, você pode editá-los com um plug-in do WordPress ou CSS para adicionar personalizações que atendam melhor às suas necessidades.
Neste artigo, mostraremos a você como editar menus no WordPress e personalizá-los facilmente.
Por que editar seu menu do WordPress?
Um menu de navegação ajuda os visitantes do site a se movimentarem pelo site com facilidade.
Com uma boa estrutura de navegação, os usuários podem navegar facilmente pelo conteúdo que os mantém no seu site WordPress por mais tempo e que os leva a agir. Por exemplo, depois de ler uma página ou uma postagem de blog, os visitantes podem decidir se inscrever em seu boletim informativo por e-mail.
O menu padrão do WordPress lista as páginas existentes do WordPress. No entanto, um menu de navegação permite que você altere o menu padrão para um com links e botões personalizados para qualquer tipo de conteúdo. Isso permite que você otimize a navegação do seu site para obter a melhor experiência do usuário.
Agora que você conhece os benefícios de editar a navegação do WordPress, vamos abordar os diferentes métodos para fazer isso.
Como editar a barra de navegação no WordPress: 2 métodos
A seguir, compartilharemos duas maneiras diferentes de alterar a navegação do WordPress. Ambos os métodos são simples; no entanto, o primeiro exemplo oferece muito mais opções de personalização.
Método 1. Como editar a barra de navegação no WordPress com o SeedProd
Primeiro, mostraremos a você como editar menus no WordPress com um poderoso construtor de páginas do tipo arrastar e soltar. Em vez de codificar manualmente as alterações no menu, os criadores de páginas permitem personalizar muitas áreas do design do seu site sem código.
O plugin que usaremos para esse método é o SeedProd, o melhor construtor de sites para WordPress. Ele vem com um editor visual de arrastar e soltar, permitindo que você personalize todo o seu site WordPress sem contratar um desenvolvedor.
Com o SeedProd, você pode criar temas personalizados para WordPress, criar páginas de destino de alta conversão e impulsionar seus esforços de geração de leads com modelos, blocos e seções personalizáveis. Ele também tem elementos de menu de navegação dedicados que você pode editar apontando e clicando.
O SeedProd também pode ajudá-lo:
- Crie uma página de "Em breve
- Aumente sua lista de e-mails
- Colocar o WordPress em modo de manutenção
- Criar páginas 404 personalizadas
- Personalize sua página de login do WordPress
- Incorporar conteúdo de mídia social
- Criar temas do WooCommerce
- E mais.
Sem mais delongas, aqui estão as etapas para editar menus no WordPress com o SeedProd.
Etapa 1. Instalar o plug-in SeedProd
Primeiro, visite a página de preços do SeedProd e escolha seu plano. O SeedProd oferece uma versão gratuita; no entanto, usaremos o SeedProd Pro para o recurso Theme Builder.
Depois disso, faça login em sua conta do SeedProd e clique na guia Downloads. Nessa tela, você pode fazer o download do arquivo .zip do plug-in e clicar no ícone da área de transferência para copiar sua chave de licença.
Em seguida, acesse seu site do WordPress, instale e ative o SeedProd. Se você nunca fez isso antes, siga este guia sobre como instalar um plug-in do WordPress.
Quando o plug-in estiver ativo, navegue até SeedProd " Settings em seu administrador do WordPress e cole sua chave no campo License Key (Chave de licença ). Clique no botão Verify Key (Verificar chave ) para salvar sua licença antes de prosseguir.
Agora, vá para a página SeedProd " Theme Builder, onde você pode começar a criar um novo tema do WordPress.
Observação: para este tutorial, criaremos um novo menu usando a funcionalidade Theme Builder do SeedProd. Se quiser manter o tema existente do WordPress, você poderá usar a mesma abordagem na Etapa 4, criando uma página de destino com o SeedProd.
Etapa 2. Escolha um modelo de tema do WordPress
O SeedProd facilita a edição de qualquer parte do seu site WordPress sem código, mas, primeiro, você precisará criar a estrutura básica do seu tema.
A maneira mais fácil é escolher um dos modelos de tema WordPress prontos. Eles vêm com todas as partes que compõem o tema prontas, portanto, tudo o que você precisa fazer é personalizá-los com o conteúdo do seu site.
Para escolher um modelo de tema, clique no botão Themes (Temas ) na página Theme Builder. Isso abrirá uma galeria de modelos que você pode visualizar em uma nova guia.
Usaremos o tema Car Maintenance para este tutorial, mas você pode escolher qualquer tema que se adapte melhor ao seu negócio. Quando você encontrar um modelo de tema de que goste, clique no ícone de marca de seleção laranja para importar as partes do modelo.
O SeedProd criará automaticamente as partes do seu tema, inclusive o cabeçalho, o rodapé, a página inicial e as páginas do blog. Agora você pode editar qualquer modelo com o construtor visual de arrastar e soltar.
Etapa 3. Personalizar a parte do modelo de cabeçalho
Muitos dos modelos pré-fabricados da SeedProd criam um menu de navegação automaticamente. Normalmente, você o encontrará no modelo Header, que mostraremos como personalizar agora.
Para editar o modelo de cabeçalho, passe o mouse sobre ele e clique no link Edit Design (Editar design ). Em seguida, ele será aberto no editor visual de páginas.
Personalizar qualquer elemento do cabeçalho é tão fácil quanto clicar nele na visualização ao vivo. Isso abrirá o painel de configurações desse elemento na barra lateral esquerda, onde você poderá alterar o conteúdo, o estilo e a funcionalidade.
Por exemplo, você pode clicar no elemento de logotipo, excluir o logotipo padrão e carregar um da biblioteca de mídia do WordPress ou do computador.
Você também pode adicionar elementos de página arrastando um bloco da barra lateral esquerda e soltando-o no cabeçalho, como ícones de mídia social, uma caixa de pesquisa e muito mais.
Agora que você já sabe como usar o editor de páginas, vamos ver como editar o menu do WordPress.
Etapa 4. Editar sua barra de navegação do WordPress
Como mencionado anteriormente, o SeedProd usa o bloco Nav Menu por padrão para exibir itens de menu.
Ao abrir as configurações do bloco, você verá que há dois métodos para criar e gerenciar menus:
- Simples
- Menu do WordPress
A opção Simples permite adicionar links ao seu menu dentro da interface do construtor de páginas. Você pode adicionar quantos links quiser a qualquer página, post, categoria, tag ou página da Web externa.
Como essa é uma abordagem simples para a criação de menus, você não pode adicionar menus suspensos ou escolher menus que já tenha criado.
Dito isso, você pode personalizar o alinhamento do menu, o tamanho da fonte, o espaçamento e o divisor. Além disso, na guia Advanced, você pode escolher entre menus horizontais e verticais e personalizar a tipografia, as cores, as bordas e muito mais.
A opção Menu do WordPress tem uma abordagem diferente. Você pode escolher um menu pré-existente no menu suspenso e ativar a navegação móvel para tamanhos de tela pequenos.
O SeedProd também inclui um link que o leva diretamente à página padrão do menu do WordPress para ajustar o layout do menu. Assim como o menu Simple, a guia Advanced tem opções de personalização para cores, fontes, sombras, visibilidade do dispositivo e muito mais.
Como posso personalizar o botão do menu no WordPress?
Você pode criar um botão de menu para o menu de navegação do WordPress com o bloco Button do SeedProd.
Localize o bloco Button na barra lateral esquerda e arraste-o para o cabeçalho. Em seguida, você pode personalizar a chamada para ação do botão, o link, o estilo e muito mais no painel de configurações do botão.
Dica profissional: você pode excluir qualquer elemento desnecessário passando o cursor sobre ele e clicando no ícone da lixeira.
Quando estiver satisfeito com seu menu de navegação, clique no botão Save (Salvar ) no canto superior direito e no ícone X para retornar ao painel do construtor de temas.
Agora, siga o mesmo processo para personalizar as outras partes do tema do WordPress.
Etapa 5. Publique seu tema personalizado do WordPress
Depois de editar o menu e os modelos de tema do WordPress, você está pronto para aplicar as alterações em seu site. Para fazer isso, localize o botão Ativar tema do SeedProd na página Theme Builder e coloque-o na posição "On".
Agora você pode acessar sua página inicial e ver seu novo menu de navegação personalizado.
Método 2. Editar menus no WordPress sem um plug-in
Se não quiser alterar o tema existente do WordPress, você poderá editar o menu usando as opções de menu integradas do WordPress.
Embora esse método não exija nenhum plug-in do WordPress, há menos opções de personalização. Além disso, a aparência do menu varia de acordo com o tema.
Para saber como editar menus no WordPress sem um plug-in, siga estas instruções.
Primeiro, acesse a página de configurações do menu do WordPress, navegando até Appearance " Menus no painel do WordPress.
Você pode adicionar itens ao seu menu existente do WordPress selecionando-os no painel Pages (Páginas ) à esquerda e clicando no botão Add to Menu (Adicionar ao menu ).
Para adicionar outro conteúdo, como posts, categorias ou links personalizados, expanda o rótulo de navegação no mesmo painel, selecione os itens e clique no botão Add to Menu (Adicionar ao menu ).
Também é fácil alterar onde o menu é exibido na guia de localização do menu; no entanto, isso depende do seu tema ativo do WordPress. Por exemplo, nosso tema do WordPress tem locais para:
- Menu principal
- Menu secundário
- Menu fora da tela
- Menu da conta conectada
- Menu de rodapé
Quando estiver satisfeito com as edições do menu, clique no botão Save Menu (Salvar menu ).
Agora você pode visualizar seu site e ver o menu de navegação em ação.
Se precisar de mais ajuda para personalizar o menu com CSS personalizado, siga estas instruções sobre como estilizar o menu de navegação do WordPress.
Próximas etapas
Esperamos que este tutorial passo a passo tenha ajudado você a aprender a editar menus no WordPress com facilidade. Se você tiver um site WooCommerce, talvez também goste deste guia sobre como adicionar um ícone de carrinho de compras WooCommerce nos menus.
Pronto para começar a personalizar os menus de seu site sem código?
Comece a usar o SeedProd hoje mesmo.
Obrigado pela leitura! Gostaríamos muito de ouvir sua opinião, portanto, fique à vontade para deixar um comentário com perguntas e feedback.
Você também pode nos seguir no YouTube, no X (antigo Twitter) e no Facebook para obter mais conteúdo útil para expandir seus negócios.