Wordpress. Create theme. Print menu in template
In last lesson we crated file structure and included css and js files for our WordPress theme. Today we will consider capability creating and printing menu in our theme
If you had entered to admin panel after last lesson, you noticed, there were no any capability to add menu to our site. In video we are considering hot to make menu support with register_nav_menu() function and print it with wp_nav_menu().
Code lesson (header.php)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>
<?php wp_head(); ?>
</head>
<body>
<header>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="#">Start Bootstrap</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<?php
wp_nav_menu(
array(
'menu_id' => '',
'menu_class' => 'navbar-nav ml-auto',
'container' => '',
'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>'
)
)
?>
</div>
</div>
</nav>
</header>
<div id="content">Code lesson (functions.php)
<?php
function loadScripts() {
wp_enqueue_style( 'bootstrap-styles', get_template_directory_uri(). '/css/bootstrap.min.css' );
wp_enqueue_style( 'main-theme-style', get_stylesheet_uri() );
wp_enqueue_script( 'bsscript', get_template_directory_uri() . '/js/bootstrap.bundle.min.js', array( 'jquery' ), '20150330', true );
}
function changeMenuItemsClass($class) {
$classes[] = "nav-item";
return $classes;
}
function addLinkClass($attrs) {
$attrs['class'] = 'nav-link';
return $attrs;
}
add_action('wp_enqueue_scripts', 'loadScripts');
add_filter('nav_menu_css_class', 'changeMenuItemsClass');
add_filter('nav_menu_link_attributes', 'addLinkClass');
register_nav_menu("main-menu", "Главное меню");
0 Comments