Word press 메뉴 링크에 클래스 추가

Word press 메뉴 링크에 클래스 추가

당신의 도움이 필요해요.메뉴에서 워드프레스가 생성하는 링크에 특정 클래스를 추가해야 합니다.뭘 편집하면 좋을까요?이 경우의 HTML 출력은 다음과 같습니다.

<nav class="nav" role="navigation">
<ul>
<li id="menu-item-8" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-8"><a href="example.com">Sample Page</a></li>
<li id="menu-item-9" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-9"><a href="http://example.com">Prova sample</a></li>
</ul></nav

메뉴를 생성하는 헤더 파일의 코드는 다음과 같습니다.

    <!-- nav -->
    <nav class="nav" role="navigation">
    <?php html5blank_nav(); ?>
    </nav>
   <!-- /nav -->

관리 패널을 통해서도 할 수 있습니다.

• [어피아란스]> [메뉴]그래서 [스크린 옵션]탭을 클릭합니다.

• [상세 메뉴 속성 표시]에서 [CSS 클래스]를 선택합니다.

• 메뉴 항목을 펼쳐 CSS Classes(옵션) 텍스트를 표시합니다.
  입력.

• 클래스를 적용할 클래스 이름을 입력하고 메뉴를 저장합니다.
  메뉴 항목

http://sevenspark.com/how-to/how-to-add-a-custom-class-to-a-wordpress-menu-item

클래스 <a class=> https://codex.wordpress.org/Plugin_API/Filter_Reference/nav_menu_link_attributes 를 추가합니다.

function add_specific_menu_location_atts( $atts, $item, $args ) {
    // check if the item is in the primary menu
    if( $args->menu == 'primary' ) {
      // add the desired attributes:
      $atts['class'] = 'menu-link-class';
    }
    return $atts;
}
add_filter( 'nav_menu_link_attributes', 'add_specific_menu_location_atts', 10, 3 );

Bootstrap 프레임워크를 기반으로 WordPress 사이트를 만든 후 원하는 클래스를 초기화하여 WordPress 내비게이션 출력을 쉽게 조작할 수 있는 솔루션을 생각해냈습니다.이렇게 하면 클라이언트 추가가 새 메뉴 항목인 경우 최종 사용자가 모든 커스텀클래스를 추가할 필요가 없어집니다.

누군가를 도울 수 있을지도 몰라

https://github.com/nickkuijpers/WordPress-Extended-Bootstrap-Nav-Walker

함수에서 html5blank_nav() 함수를 편집해 보십시오.php 파일

// HTML5 Blank navigation
function html5blank_nav()
{
wp_nav_menu(
array(
    'theme_location'  => 'header-menu',
    'menu'            => '',
    'container'       => 'div',
    'container_class' => 'menu-{menu slug}-container',
    'container_id'    => '',
    'menu_class'      => 'menu',
    'menu_id'         => '',
    'echo'            => true,
    'fallback_cb'     => 'wp_page_menu',
    'before'          => '',
    'after'           => '',
    'link_before'     => '',
    'link_after'      => '',
    'items_wrap'      => '<ul>%3$s</ul>',
    'depth'           => 0,
    'walker'          => ''
    )
);
}

언급URL : https://stackoverflow.com/questions/20752318/wordpress-add-a-class-to-menu-link