یکی از مواردی که طراحان در تبدیل کردن قالب بوت استرپ به وردپرس ، داینامیک کردن منو بوت استرپ است. اگر به کد های منوی بوت استرپ دقت کنید متوجه میشید که به سادگی داینامیک نخواهد شد. افزونه ی WP Bootstrap Menu نیز برای این مورد طراحی شده اما اگر بخواهیم قالبمان به افزونه خاصی وابسته نباشید در ادامه با ما همراه باشید …
در ابتدا فایل wp_bootstrap_navwalker.php را از لینک زیر دانلود و در فولدر قالبتان (کنار فایل style.css) قرار بدید:
سپس فایل functions.php قالبتان را باز کرده و کد زیر را به انتهای آن اضافه کنید:
require_once('wp_bootstrap_navwalker.php');
اگر قالبتون از قبل از منو وردپرس پشتیبانی نمیکرد کد زیر را نیز به functions.php اضافه نمایید :
register_nav_menus( array( 'primary' = __( 'Primary Menu', 'THEMENAME' ), ) );
با استفاده از دستور زیر در فایل header.php امکان استفاده از منو را اضافه کنید :
?php wp_nav_menu( array( 'menu' = 'primary', 'theme_location' = 'primary', 'depth' = 2, 'container' = 'div', 'container_class' = 'collapse navbar-collapse navbar-ex1-collapse', 'menu_class' = 'nav navbar-nav', 'fallback_cb' = 'wp_bootstrap_navwalker::fallback', 'walker' = new wp_bootstrap_navwalker()) ); ?
مثال ساده استفاده در header.php به صورت زیره :
nav class="navbar navbar-default navbar-fixed-top" role="navigation" !-- Brand and toggle get grouped for better mobile display -- div class="container" div class="navbar-header" button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse" span class="sr-only"Toggle navigation/span span class="icon-bar"/span span class="icon-bar"/span span class="icon-bar"/span /button a class="navbar-brand" href="?php bloginfo('url'); ?" ?php bloginfo('name'); ? /a /div ?php wp_nav_menu( array( 'menu' = 'primary', 'theme_location' = 'primary', 'depth' = 2, 'container' = 'div', 'container_class' = 'collapse navbar-collapse navbar-ex1-collapse', 'menu_class' = 'nav navbar-nav', 'fallback_cb' = 'wp_bootstrap_navwalker::fallback', 'walker' = new wp_bootstrap_navwalker()) ); ? /div /nav