WordPress

Menu Personalizado no WordPress – Criar menu personalizado no WordPress.

Se você por um acaso necessita criar um menu personalizado no WordPress, por algum motivo que pode ser, controle sobre quais páginas exibir, inserir classe personalizada para o CSS, inserir link para conteúdo externo, ou qualquer que seja o motivo, aqui vou mostrar como é fácil.

Criar menu personalizado no WordPress

1º Passo – Criando o menu e seus links

Você deve acessar o painel de administração, se você estiver usando as configurações padrões do WordPress deve ser algo como seudominio.com.br/wp-admin, procure pela aba Aparência e no sub-menu, procure por Menu.

Vai exibir uma aba onde você deve preencher o nome do menu personalizado no WordPress, depois clique em criar menu.

Você acabou de criar um menu, porém ainda não tem links para serem exibidos, então agora vamos criá-los.
Existem 3 possibilidades de você criar links para o menu personalizado no WordPress, vou explicar melhor agora

A primeira maneira, que é a que eu uso, esta no box nomeado Links Personalizados. Existem dois campos, sendo eles:

URL: pode ser link interno absoluto (http://www.seudominio.com.br), também pode ser link interno relativo (/nome-da-sua-pagina) e a vantagem de usar links relativos, na minha opinião é o fato de poder mudar de dominio sem ter que fazer alterações.
Também pode ser link externo (http://www.linkexterno.com.br) e mais adiante veremos como abri-lo em uma nova aba (target=’_blank’).

Rótulo: Como próprio nome diz, é o rótulo do link que vai ser exibido dentro do menu personalizado no WordPress. Agora basta clicar em Adicionar ao menu.

A segunda maneira de criar links, é usar o box Páginas, selecionando quais páginas publicadas, você deseja exibir no seu menu. Depois clique em Adicionar ao menu.

A terceira maneira de inserir links para seu menu personalizado no WordPress, é usar o box Categorias que tem a mesma lógica da segunda maneira. Selecione quais categorias deseja inserir no seu menu e basta clicar em Adicionar ao menu.

2º Passo – Ordenando o menu

Você pode ordenar o menu personalizado no WordPress, arrastando os blocos de links para cima e para baixo, moleza né?

3º Passo – Personalizando o menu – CSS – Página de Destino – Atributo Título do link

Agora vamos personalizar os links, para isso, basta você clicar no box do link que desejar e o conteúdo vai se expandir, exibindo alguns campos, sendo eles:

Rótulo de navegação: Rótulo criado no passo anterior.

Atributo título: Título exibido ao passar o mouse sobre o link.

URL: o nome já é auto-explicativo, porém esse campo só é exibido caso o link tenha sido criado com Links Personalizados.

O WordPress por padrão vem com algumas opções ocultas, e para exibir, na página de Menu, vá até o topo da página e clique em Opções da Tela, o conteúdo vai se expandir e aparecerão as seguintes opções para personalizar o link do seu menu WordPress.

Destino do link: exibe um checkbox para escolher se o link abrirá na mesma página/aba ou em uma nova página/aba.

Classe de CSS: opção para personalizar a classe de CSS de cada link do menu no WordPress.

Relação de links: é a relação (‘rel=’) que o link tem com sua página. Clique aqui e saiba mais sobre relação de links.

Descrição: aqui vai a descrição do link que pode ser exibido junto com o link, mas adiante criarei um post somente sobre esse assunto.

Depois de selecionar quais opções vão ser exibidas, basta voltar no box do Link que as opções estarão disponíveis para você.

4º Passo – Posicionando o menu no WordPress

Na página de criação do menu, existe um box com nome de Posições no tema. Existe um dropdown para você selecionar qual menu você quer usar e qual o posicionamento dele. Por padrão nos temas twentyeleven, twentytwelve vem com suporte a apenas 1 Menu, que é o no topo do site. Caso necessite adicionar um menu personalizado, basta que adicione o seguite código dentro do seu functions.php que fica em na pasta /wp-content/themes/nome-do-seu-tema

PHP

/**** ADICIONA OS MENUS PERSONALIZADOS ***/
add_action( 'init', 'register_my_menus' );
function register_my_menus() {
register_nav_menus(
array(
'menu-topo' => __( 'Menu Topo' ),
'menu-coluna-lateral' => __( 'Menu Coluna Lateral' ),
'menu-rodape' => __( 'Menu Rodapé' )
)
);}

Depois basta adicionar essa linha onde desejar que o menu seja exibido, nesse exemplo foi adicionado no sidebar.php que fica na pasta /wp-content/themes/nome-do-seu-tema.

PHP

<?php wp_nav_menu( array( 'theme_location' => 'menu-coluna-lateral' ) );?>

Pronto, agora você já sabe como adicionar um menu personalizado no WordPress.

Se o post te ajudou curte a página, não custa nada e me incentiva a continuar escrevendo.
Posts recomendados
Comentários

    3 respostas para Menu Personalizado no WordPress – Criar menu personalizado no WordPress.

    1. Vanderlei escreveu em 15 de junho de 2014

      estou necessitando saber como faço para inserir, trocar, estilizar o nome de cada página filho, mas não me refiro ao cabeçalho, exemplo tenho um página chamada “PRODUTOS” ao editar essa página com o nome produtos, não tenho a opção caixa de edição para inserir link, tipos de letras, cores, url’s ou imagem, porém logo abaixo tenho uma opção addmidia que contém todas as opções para formatar o texto, mas reintero que o título que está abaixo do cabeçalho eu não consigo reestilizar, tenho lido na internet onde alguns tutoriais dizem que depende do meu tema, esta opção é editável ou não, já outros videos youtube dizem que deve alterar o código do estilo css, por este motivo, se souberem como me ajudar, Peço que me mandem a resposta por e-mail:[email protected] Grato!!

    2. Qcabeca escreveu em 16 de junho de 2014

      Opa Vanderlei, não consegui entender sua dúvida, pois na sua descrição, ficou um pouco confuso o que é MENU, o que é página, o que é single. Pode enviar imagens, etc pra ilustrar melhor? Sucesso ae. Abraços

    3. fernadno escreveu em 23 de junho de 2015

      vlws..

    Envie seu comentário.

    Seu email não será publicado