Question

我无法将自己的风格融入wordpress。我知道有一个选项可以在wordpress本身内执行此操作，它确实有效，但看起来并没有连接到导航栏。我想要做的就是为每个导航栏链接添加一个“滑动中间输出”类。

<div class="collapse navbar-collapse" id="mainNavbar"><!-- NAVBAR COLLAPSE -->        

                    <div class="site-nav"><!-- SITE NAV -->

                        <?php

                            $args = array(

                                'theme_location' => 'primary'

                            );

                        ?>

                        <?php wp_nav_menu( $args ); ?>

                    </div><!-- ./SITE NAV -->

                </div><!-- NAVBAR COLLAPSE -->

我是否需要单独指定每个链接或？，因为这在主题中是不实际的。

Answer 1

您可以在菜单标记中添加相当多的信息，有关完整列表，请参阅此处：https://developer.wordpress.org/reference/functions/wp_nav_menu/

但是，要将类添加到实际的<a>代码中，您需要创建一个非常复杂的导航步行器。

这里有关于Wordpress中的Walkers的一些信息：https://codex.wordpress.org/Class_Reference/Walker

一个非常简单的例子，应该添加你想要的类。您需要将其放在主题的functions.php文件中：

<?php
class Walker_Menu extends Walker {

    // Tell Walker where to inherit it's parent and id values
    var $db_fields = array(
        'parent' => 'menu_item_parent', 
        'id'     => 'db_id' 
    );

    /**
     * At the start of each element, output a <li> and <a> tag structure.
     * 
     * Note: Menu objects include url and title properties, so we will use those.
     */
    function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
        $output .= sprintf( "\n<li><a href='%s'%s>%s</a></li>\n",
            $item->url,
            ( $item->object_id === get_the_ID() ) ? ' class="sliding-middle-out current"' : ' class="sliding-middle-out"',
            $item->title
        );
    }

}?>

然后将walker类添加到菜单调用中：

<?php
$args = array(
    'theme_location' => 'primary',
    'walker' => new Walker_Menu
);
wp_nav_menu( $args );
?>

如何将bootstrap导航栏样式集成到wordpress中

1 个答案: