dongshimao7115 2016-03-23 10:59
浏览 103

如何将自定义类添加到wordpress菜单<a>标记

I'm creating a wordpress website from scratch and I have problem with page scroll to anchor. I'm using Bootstrap Nav Walker module for it, how should I add my .page-scroll class to my menu item <a>?

Here is my header.php menu:

<nav class="navbar navbar-custom navbar-fixed-top" role="navigation">
        <div class="container">
            <div class="navbar-header page-scroll">
                <button type="button" class="navbar-toggle collapse" data-toggle="collapse" data-target=".navbar-main-collapse">
                    <i class="fa fa-bars"></i>
                </button>
                <a class="navbar-brand" href="#page-top">
                  <img id="#page-top" src="<?php echo get_template_directory_uri(); ?>/images/logo3.png" alt="Brand logo">
                </a>
            </div>

            <?php
              wp_nav_menu( array(
                  'menu'              => 'primary',
                  'theme_location'    => 'primary',
                  'depth'             => 2,
                  'container'         => 'div',
                  'container_class'   => 'collapse navbar-collapse navbar-right navbar-main-collapse',
                  'container_id'      => 'bs-example-navbar-collapse-1',
                  'menu_class'        => 'nav navbar-nav',
                  'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                  'walker'            => new wp_bootstrap_navwalker())
              );
          ?>

            <!-- Collect the nav links, forms, and other content for toggling -->
        </div>
        <!-- /.container -->
    </nav>

This is my js:

$(function() {
    $('.page-scroll a').bind('click', function(event) {
        var $anchor = $(this);
        var $anchor_scroll = $($anchor.attr('href')).offset().top;
        var $anchor_scroll_calc = $anchor_scroll;
        $('html, body').stop().animate({
            scrollTop: $anchor_scroll_calc
        }, 1500);
        event.preventDefault();
    });
});

Here is my wordpress menu item:

Here is my wordpress menu item

  • 写回答

2条回答 默认 最新

  • douhuan1648 2017-01-16 12:09
    关注

    Go to wp_bootstrap_navwalker

    $item_output .= '';

    评论

报告相同问题?