Menu do WordPress: como criar e adicionar em seu site

Saiba como criar um menu personalizado no WordPress e adicioná-lo em diferentes áreas do seu site (como topo, rodapé ou lateral).

Por Fabio Lobo, publicado em 16/11/2021.

Se você tem um site com WordPress já sabe que uma das principais vantagens da ferramenta é a autonomia total que ela proporciona para seus administradores – seja para criar um texto, adicionar banners, mudar todo o visual do site ou… criar um menu.

Um site bem organizado, fácil de navegar, começa pelo menu. É por lá que os visitantes irão encontrar o que estão procurando. Então, essa é uma área do seu site que merece muita atenção.

Pensando nisso, fiz esse post para explicar toda a mecânica de criação e edição de menus no WordPress!

ilustração de um menu; à frente, o texto Menu do WordPress

Como criar um menu no WordPress?

Criar um menu no WordPress é um trabalho que envolve apenas alguns cliques, e possivelmente arrastar e soltar um elemento ou outro.

Veja o passo a passo a seguir:

1. Criar novo menu ou selecionar existente

painel de menus

Em primeiro lugar, é preciso acessar o painel de menus do WordPress. Conforme imagem acima, fica em Aparência > Menus.

Em seguida, você deve escolher uma das duas opções na barra que aparece logo abaixo da aba Editar menus:

  1. Selecionar um menu existente: Em algumas instalações, o WordPress já tem pelo menos um menu já existente. Então, em vez de criar um novo, você pode editar o que já existe (principalmente se sua intenção é editar um menu que já está sendo utilizado em seu site).
    Nesse caso, selecione o menu desejado no campo indicado e, por fim, clique em Selecionar.
  2. Criar um menu novo: Se não há menus existentes ou você quer mesmo criar uma lista de opções nova, então clique no link criar um novo menu. Em seguida, digite um nome para o menu no campo indicado e clique no botão Criar menu.

2. Adicionar itens no menu

adicionar itens no menu

O próximo passo é abastecer o menu criado com links. Para isso, basta selecionar os itens desejados na área Adicionar itens no menu (conforme imagem acima) e clicar no botão Adicionar ao menu.

Tenha em mente!

Você sabia que escolher a hospedagem errada pode reduzir sua nota no Google, causar lentidão e até mesmo deixar seu site vulnerável para invasões e vírus?

Clique aqui e saiba mais!

Por padrão, as opções disponíveis de itens que podem ser adicionados ao menu são: Páginas, Posts, Links personalizados e Categorias.

No entanto, é possível adicionar algumas opções a mais:

2.1. Como mostrar mais opções?

elementos da tela

No canto superior direito da tela do WordPress há um botão chamado Opções de tela. Ao clicar nesse botão, você poderá adicionar ou remover o que pode aparecer em seu menu.

Por exemplo, é possível adicionar Tags na área Adicionar itens no menu. Além disso, se seu WordPress tem opções como custom post types ou o WooCommerce instalado, outras possibilidades estarão disponíveis nessa área.

Mas se ainda assim você não encontrou o que procurava, não entre em pânico: no tópico a seguir você verá que é possível adicionar qualquer tipo de link em seu menu.

Por fim, em Mostrar propriedades avançadas de menu, há algumas opções que podem ser úteis para seus links:

  • Destino do link: adiciona a opção de abrir o link em uma nova aba;
  • Atributo do título: possibilita adicionar um texto que aparece quando o visitante move o cursor em cima do link;
  • Classes CSS: possibilita adicionar classes de CSS em cada link;
  • Relação de Links (XFN): adiciona a opção de definir o atributo rel de cada link, como nofollow, por exemplo;
  • Descrição: possibilita adicionar uma descrição em cada link.

2.2. Como criar links para o menu?

links personalizados

De volta à área Adicionar itens no menu, ao clicar em Links personalizados você poderá criar qualquer tipo de link para seu menu.

Basta inserir no campo URL o endereço do link (que pode ser um link de âncora, inclusive), e o nome do link no campo Texto do link.

3. Estrutura do menu

estrutura do menu

Se você já adicionou os links ao menu criado, então é hora de personalizar o menu. Ou seja: ajustar a ordem dos itens, editar os atributos dos links, criar submenus etc.

Na área Estrutura do menu você pode arrastar os itens para organizá-los na ordem desejada. Veja na imagem acima um exemplo de menu mais completo.

3.1. Como criar submenus?

exemplo de submenu

Para criar submenus, a lógica é a seguinte: arraste um item para baixo do que seria o item principal, e então desloque-o levemente para a direita.

Veja na imagem acima como os itens “Consultoria” e “Meio ambiente” estão mais à direita em relação ao item “Sobre”.

É isso: no site, “Sobre” é o item principal, e quando o visitante passa o mouse por cima dele, o submenu com os itens “Consultoria” e “Meio ambiente” aparece. No entanto, para isso funcionar seu tema deve ter suporte a submenus.

3.2. Como editar links no menu?

edição de link no menu

Conforme você viu no tópico 2.1 deste post, através do botão Opções de tela é possível selecionar algumas propriedades avançadas para os links do menu.

Então, se você quer personalizar seus links com opção de abrir em nova aba, rel="nofollow", adicionar classes, título ou até mesmo descrição, revise o tópico 2.1 para saber o que você precisa selecionar.

Assim, volte ao menu e as opções selecionadas estarão disponíveis para edição.

4. Configurações do menu

configurações do menu

Por fim, no final da área Estrutura do menu há as Configurações do menu. Essa parte é bem básica, tendo apenas duas opções:

  • Adicionar páginas automaticamente: Selecione essa opção se você desejar que páginas de nível superior apareçam automaticamente no menu. Ou seja, quando você criar páginas descendentes no WordPress, elas aparecerão no menu abaixo da página ascendente.
  • Local de exibição: Se o tema do seu WordPress tiver áreas de menus definidas, elas aparecerão nessa opção. Por exemplo: se seu site tem uma área chamada “Menu do topo” e você selecioná-la, seu menu aparecerá nessa área (que provavelmente será no topo do seu site).

Por fim, não se esqueça de clicar no botão Salvar menu quando finalizar. Você poderá voltar para editar esse menu quantas vezes quiser (se tiver dúvidas sobre como fazer isso, revise o tópico 1 deste post).

Como adicionar um menu no site WordPress

Só criar um menu não é o suficiente: é preciso adicioná-lo ao site também, obviamente.

Mas se você não sabe como fazer isso, confira abaixo as duas alternativas possíveis:

Menu no topo ou rodapé

painel de gerenciamento de posições de menus

Conforme você pode ver no último tópico do passo a passo acima, uma das opções para adicionar um menu em seu site WordPress é através das áreas de menus definidas em seu tema.

Ou seja: isso pode variar de tema para tema. Pode ser que o seu não tenha nenhuma área, ou então que tenha várias áreas – ou até mesmo que tenha um painel próprio para o tema.

Como exemplificado na imagem acima, em Aparência > Menus > Gerenciar posições você verá todas as áreas disponíveis para menus em seu site. Funciona assim:

  • Posição no tema: Indica onde o menu irá aparecer. Por exemplo: Menu do topo, ou Menu do rodapé.
  • Menu atribuído: Área para selecionar qual menu deverá aparecer nessa posição.

Repito: essa parte pode ser completamente diferente para você. Tudo depende do tema que está instalado em seu WordPress.

Menu lateral ou em widgets

painel de widgets com exemplo de menu

Por fim, se seu tema tem suporte a widgets, você também poderá utilizar seu menu nelas. Para tanto, siga o passo a passo:

  1. Vá em Aparência > Widgets;
  2. Clique no botão +;
  3. Digite “menu” na busca e selecione a widget Menu;
  4. Adicione a widget Menu na área desejada (por exemplo, na lateral do seu site, se houver essa opção), e então escreva um título e selecione o menu escolhido.

Créditos das imagens: Freepik e WOWF.

Tire suas dúvidas

Conseguiu criar seu próprio menu no WordPress? Se ainda tiver dúvidas, confira o FAQ abaixo ou então deixe um comentário!

Como criar um submenu?

Para criar um submenu no WordPress, basta arrastar os subitens desejados para baixo do item principal, deslocando-os levemente para a direita. Veja o passo 3.1 deste post para mais informações.

Como criar um menu com âncoras para landing page?

Para criar um menu com âncoras no WordPress, ideal para landing pages e one page sites, basta selecionar a opção Links personalizados e, no campo URL, digitar a âncora de acordo com o ID do elemento que você quer linkar. Veja o passo 2.2 deste post para mais informações.

Como criar um menu com ícones?

Alguns temas possibilitam a criação de menus com ícones, mas essa função pode ser muito diferente de entre um tema e outro. Também é possível adicionar ícones ao seu menu através de CSS, caso você tenha experiência com front-end.
Outra alternativa é a utilização de um plugin, como o Menu Icons by ThemeIsle.

A cópia dos conteúdos e trabalhos deste site não é permitida. Saiba mais clicando aqui!

Fique por dentro!

Cadastre seu e-mail abaixo se você quiser receber posts, dicas e conteúdos por e-mail:

Quem é Fabio Lobo?

Web designer, desenvolvedor front-end e programador WordPress.

Quem é Fabio Lobo?

Estou há mais de uma década na área. O foco do meu trabalho é em usabilidade, facilidade pro usuário, acessibilidade, SEO e performance.

Também tenho alguns projetos open source, além de prestar consultoria em hospedagem WordPress e criação de conteúdo.

Como posso te ajudar hoje?

Trabalho com consultoria, suporte, manutenção, criação e desenvolvimento.

Fale comigo
Leia também...

...alguns textos que têm a ver com o assunto:

Retrospectiva 2020: WordPress, Google, COVID-19 e mais
Retrospectiva 2020: WordPress, Google, COVID-19 e mais

2020 definitivamente foi um ano assustador. Em todos os sentidos! Confira (ou não) a retrospectiva 2020 do meu ponto de vista.

Como criar um índice no WordPress
Como criar um índice no WordPress

Quer deixar seus conteúdos mais organizados e ainda ter benefícios de SEO e UX? Saiba como criar um índice no WordPress!

WordPress: Tema pronto ou exclusivo? Veja prós e contras
WordPress: Tema pronto ou exclusivo? Veja prós e contras

Não sabe a diferença entre um tema pronto (ou premium) para WordPress e um exclusivo (ou próprio), feito na medida para seu projeto? Confira!

Deixe seu comentário

Se você deseja um orçamento, entre em contato clicando aqui.

Quero um orçamento