Bootstrap菜单样式灵活多样,如果你的Wordpress主题是采用Bootstrap框架开发的,你想换掉它的导航样式的话,这篇文章将对我们有一定的帮助。或者你正在开发一个Bootsrap框架的Wordpress主题,在替换wp_nav_menu样式上,是比较麻烦,这篇文章对我们一定会有很大的帮助。
一、加载第三方插件代码
首先下载歪果仁开源的WordPress下生成Bootstrap导航条HTML代码文件:百度网盘下载 wp_bootstrap_navwalker.php ,放到主题根目录里,或者你自己自定义文件夹里,我是放在inc文件夹里。然后在主题的functions.php文件中添加以下代码:
// 导入bootstrap菜单样式
include_once('inc/wp_bootstrap_navwalker.php');
二、注册主题菜单,在主题的functions.php文件中添加以下代码:
register_nav_menus( array( 'header-menu' => __( 'top_menu' ) ) );
三、在header.php中输出菜单的位置添加代码:
<?php wp_nav_menu( array( 'theme_location' => 'header-menu', 'container' => '', 'menu_class' => 'nav navbar-nav', 'fallback_cb' => 'wp_bootstrap_navwalker::fallback', 'before' => '', 'after' => '', 'walker' => new wp_bootstrap_navwalker()) ); ?>
四、效果截图