2017-01-11 1 views
1

wp-bootstrap-navwalker를 사용하여 탐색을 사용자 정의하려고합니다. 여기 wordpress에서 wp-bootstrap-navwalker를 사용자 정의하는 방법

내 현재의 정적 코드의 예를

<div class="collapse navbar-collapse"> 
    <ul class="navbar-nav nav navbar-right"> 
    <li><a class="menu" href="index-2.html">home</a></li> 
    <li><a class="menu" href="#">travel</a></li> 
    <li><a class="menu" href="#">lifestyle</a></li> 
    <li><a class="menu" href="about.html">about me</a></li> 
    <li><a class="last-menu" href="contact.html">contact</a></li> 
</ul> 
</div> 

내가 완벽하게 잘 작동

wp_nav_menu(array(
    'menu'    => 'primary', 
    'theme_location' => 'primary', 
    'depth'    => 2, 
    'container'   => 'div', 
    'container_class' => 'collapse navbar-collapse', 
    'menu_class'  => 'nav navbar-nav navbar-right', 
    'fallback_cb'  => 'wp_bootstrap_navwalker::fallback', 
    'walker'   => new wp_bootstrap_navwalker()) 
); 

가 동적으로 만들이 포스트 - 부트 스트랩 - navwalker을 사용하고 있습니다. 이제 문제가 생겼습니다. 내 <a class="menu">home</a> 안에는 클래스가 있습니다. 해당 데이터가 동적으로 전달되는 경우 어떻게 menu 클래스를 내 앵커 태그 안에 넣을 수 있습니까? 우리가 이것을 wp_nav_menu(array());을 사용자 정의 할 수있는 방법이 있습니까?

+0

'wp_bootstrap_navwalker()가'start_el' 메소드를 오버라이드하고 있습니까? –

답변

0

워드 프레스 방식은 'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>',wp_nav_menu(array())에 추가하는 것입니다. 그런 다음 사용자 정의 탐색 항목과 일반 링크 항목에 대한 특수 클래스를 갖게됩니다. 그런 다음 CSS에서 타겟팅 할 수 있습니다. 유용한 링크 : wp_nav_items css

그렇지 않으면 당신은 변경해야 wp_bootstrap_navwalker

-1

이 코드

<header> 
     <nav class="navbar navbar-expand-md navbar-dark bg-dark mb-4"> 
    <a class="navbar-brand" href="#">Top navbar</a> 
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> 
    <span class="navbar-toggler-icon"></span> 
    </button> 
    <div class="collapse navbar-collapse" id="navbarCollapse"> 
    <ul class="navbar-nav mr-auto"> 
     <li class="nav-item active"> 
     <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> 
     </li> 
     <li class="nav-item"> 
     <a class="nav-link" href="#">Link</a> 
     </li> 
     <li class="nav-item"> 
     <a class="nav-link disabled" href="#">Disabled</a> 
     </li> 
    </ul> 

    </div> 

에게 사용을 그리고 난하려면이 WP-부트 스트랩-navwalker를 사용하는 것이 동적

<?php 
    wp_nav_menu(array(
      'menu'    => 'top', 
      'theme_location' => 'primary', 
      'depth'    => 2, 
      'container'   => 'div', 
      'container_class' => 'collapse navbar-collapse', 
      'container_id'  => 'navbarCollapse', 
      'menu_class'  => 'navbar-nav mr-auto', 
      'fallback_cb'  => 'WP_Bootstrap_Navwalker::fallback', 
      'walker'   => new WP_Bootstrap_Navwalker()) 
     ); 

    ?> 

하지만 getbootstrap에 표시된 예에서는 표시되지 않습니다.

관련 문제