Criando um site do zero com WordPress - #20 Criando menu dinâmico

Na vídeo-aula de hoje vamos aprender como configurar um menu dinâmico no WordPress.

Habilitando Menu Dinâmico no WordPress

Para habilitar o menu dinâmico no nosso WP, vamos inserir o seguinte código no arquivo functions.php.

#Criar o registro do menu
function RegistroMenu(){
    register_nav_menu('MenuSite',__('Menu do Site'));
}
add_action('init','RegistroMenu');

Chamando o Menu Dinâmico

Para chamarmos o menu dinâmico, vamos utilizar uma função nativa do WP, setando as configurações que desejamos:

<?php
wp_nav_menu(array(
    'theme_location' => 'MenuSite',
    'container_class' => 'BottomFaixa'
));
?>

No código acima, setamos que a classe css que vai receber nosso menu é a BottomFaixa.

Estilizando menu no WordPress

Para estilizarmos nosso menu no WP, vamos editar nosso CSS da seguinte forma:

.BottomFaixa{position:absolute; bottom: 0; width:100%; height: 50px; background: #000;}
    .BottomFaixa ul{margin:0;}
    .BottomFaixa li{float:left; width: 20%; line-height: 50px; text-align: center; list-style: none;}
    .BottomFaixa a{color:#FFF; text-decoration: none;}
    .BottomFaixa a:hover{text-decoration: underline;}

Lembrando que após as configurações dos códigos acima, é necessário entrar no menu e criar o menu com o nome MenuSite.