Menu personalizado no WordPress
Após a versão 3.0 do WordPress, muitas funcionalidades foram incorporadas. Uma delas foi a opção para criação de menus personalizados. Sem dúvida nenhuma, os menus personalizados são fundamentais para a criação de um menu mais organizado.
Percebendo que algumas pessoas tem dúvidas de como utilizar menus personalizados, e a pedido de Edson do blog Livraria Afinidades, resolvi criar este artigo explicando o processo. Você vai perceber que é bem simples.
A primeira coisa que você deve saber, é que o template precisa estar adaptado para a utilização de menus personalizados, pois ainda existem templates antigos que não são compatíveis com menus personalizados.
Para saber se o template que você está utilizando é compatível com menus personalizados, clique em Aparência>Menus no painel do WordPress. Lá deverá ter uma mensagem informando se o seu tema suporta ou não o uso de menus personalizados.
No caso dos meus blogs – Criador Sites e Publique Ideias - que utilizam o tema Mystique, a opção que é oferecida pelo tema é a mostrada na figura abaixo.
Menu personalizado tema Mystique
Como vocês podem perceber, o tema Mystique permite que eu adicione até 3 menus personalizados em sua estrutura. Um no topo, um abaixo do cabeçalho e um no rodapé.
Porque criar menus personalizados?
A grande vantagem dos menus personalizados, é que podemos criar uma estrutura de menus no formato que desejamos.
Você pode criar menus utilizando Páginas, Categorias e Links Personalizados. Com a opção dos links personalizados, você tem a total liberdade de criar menus para o link que você desejar.
Graças ao menus personalizados, foi que pudemos criar facilmente a estrutura de menus do Publique Ideias. Como vocês podem observar na figura abaixo, criamos um link personalizado chamado “Categorias”, com a sua URL linkando para #, ou seja, para nada.
Menu personalizado do Publique Ideias
E criamos os links das categorias no estilo dropdown, apenas arrastando as categorias logo abaixo do link personalizado “Categorias”. Veja:
Estrutura de menu personalizado
Após criar a sua estrutura, basta salva-la com o nome nome que você desejar e selecionar o local onde você deseja que o menu personalizado apareça. Observe na primeira figura mostrada, ”Menu personalizado tema Mystique”, que selecionamos os menus do rodapé e do cabeçalho.
Widget menu personalizado
Também é possível apresentar os menus personalizados através do Widget “Menu”. Com ele você poderá exibir seus menus personalizados nas sidebars e estruturas que o seu tema permitir. Veja a imagem abaixo:
Widget menu personalizado
Temas antigos
Os temas mais antigos, antes lançados antes da versão 3.0 do WordPress não suportam menus personalizados. Mas você pode adicionar essa funcionalidade inserindo o código abaixo no arquivo functions.php do seu tema. Sugerimos que você utilize a prática de temas filhos para isso.
O código abaixo fará com que seja criado a posição para 3 menus (Menu Top, Menu Sideber e Menu Footer).
/*******************************
Adiciona ação menus personalizados
********************************/
add_action( 'init', 'register_my_menus' );
function register_my_menus() {
register_nav_menus(
array(
'menu-top' => __( 'Menu Top' ),
'menu-sidebar' => __( 'Menu Sidebar' ),
'menu-footer' => __( 'Menu Footer' )
)
);
}
E depois inclua os códigos PHP no local desejado em que você queira mostrar o menu no tema. Por exemplo, o código abaixo exibirá o menu do rodapé (footer).
<?php wp_nav_menu( array( 'theme_location' => 'menu-footer' ) );?>
Acredito que para quem já utiliza o WordPress a algum tempo, esse artigo não seja nenhuma novidade. Mas para quem ainda não conhece, tenho certeza que será muito útil!
Artigos Relacionados
WordPress.com Stats cria carinha sorridente (Smiley) no blog... 20 de agosto de 2010 | Alexandre K. Cordeiro
URL Amigável (Links Permanentes) 2 de agosto de 2010 | Alexandre K. Cordeiro
Dois efeitos de lightbox no mesmo blog 24 de novembro de 2010 | Roberto João Rosa Jr.
8 novidades a esperar no novo WordPress 3.1... 30 de setembro de 2010 | Alexandre K. Cordeiro
Comentar via Facebook
-
Alexandre boa tarde.. estou sofrendo pra conseguir inserir um slide na home do mistyque.. eu baixei varios slides mais nao consigo fazer aparecer.. no caso o ultimo que eu tentei pede pra adiconar a linha aonde eu quero q apareça o slide e [meteor_slideshow] no post ou na página.. vc sabe aonde tem q ser colocado essa linha pra pra poder aparece o slide na home? valeu cara.
-
Alexandre bom dia, gostaria de saber se tem como eu colocar dentro de uma pagina de serviços prestados por ex uma imagem ainda q pequena do tipo do serviço e um texto falando sobre o mesmo logo ao lado da imagem e descendo sobre ela posteriormente pra ficar uma coisa mais organizada .. deu pra entender??Eu sei que da pra por a imagem mais queria dessa forma organizada. agradeço se puder ajudar abraços.
-
Olá Lucas. Desculpe, não consegui entender a sua pergunta. Teria algum site com o exemplo do que você precisa?
-
Alexandro, tipo assim: estou criando um site com o wordpress, no caso ele ja tem os menus com as paginas, as pagina que eu tenho sao home, serviços, sobre, contato etc.. gostaria de saber se quando eu for colocar o conteudo dentro dessas páginas (na sobre por exemplo) se eu quiser colocar uma foto da pessoa dona do site ao lado de um texto falando sobre ela tipo esse site do bruno avila
http://www.brunoavila.com.br/avante/about pq pelo que tentei eu consegui colocar a foto mais o texto foi pra baixo.. nao ficou do lado.. entende? o mesmo acontece com os serviços, ficaria um foto do serviço e do lado um texto falando obre o mesmo. obrigado por responder abraços.-
Agora entendi o que você quer fazer! Achei que era algo no menu. Mas para fazer é fácil. Crie uma página e insira uma imagem em “adicionar mídia”. Quando você for adicionar a imagem , procure por alinhamento. Lá você definirá o alinhamento da imagem, centro, esquerda, direita ou nenhum. Alinhe a esquerda, que o texto ficará ao lado
Se você já inseriu a imagem, é só passar clicar uma vez em cima da imagem e clicar no ícone “Editar imagem”. Lá tem a opção de alinhamento!-
Po cara, fiz oq vc disse.. deu certo.. valeu mesmo.. eu achei que daria pra fazer isso com tableless apenas.. mais alinhando a imagem a esquerda o texto ja vai pro lado.. obrigado cara abraçoss
-
-
-
-
-
Ola Alexandre, gostaria de saber se esse esquema funciona para o WordPress estilo site.. pois estou com uma cliente que gostou de um template mais ele nao vem com menu dropdown mais ela gostaria q na aba serviços tivesse um dropdown com os serviços prestados. Obrigado
-
Olá Vinicius,
O menu dropdown somente funcionará se o template for compatível.
Neste caso o tema deverá ter um menu dropdown como o seu cliente deseja. Ou você poderá modificar o tema de acordo com as necessidades do seu cliente, porém é algo que envolverá conhecimentos de HTML e CSS.-
Sim Alexandre.. mais minha duvida é: se o template que meu cliente quer for compatível, basta fazer esse procedimento que vc ensinou? ou eu tenho que baixar o template ja com o menu drop?
-
Isso! O template deverá ter o menu drop
-
-
-
-
Muito obrigado, algo tão simples e eu não sabia, aprendi aqui, muito obrigado deu certo no meu blog *-*
-
Ola Alexandre… Mas como faco para – apos criar um menu personalizado – poder “chama-lo” dentro de uma pagina?
Por exemplo> meu menu personalizado compreende as Páginas
A + B + C
Mas eu quero criar na pagina D links diretos paras as demais paginas ( ou seja A B e C) que ja estao agrupadas no menu.
como “chamar” este menu dentro da minha pagina? -
Muito obrigada! Tinha pego esses códigos em outro site e eles não estavam funcionando. Agora deu certin! =D
Comentários