Question

我正在开发自己的自定义Wordpress主题，并且在处理菜单导航时遇到了问题。基本上我已经了解到Wordpress具有名为wp_nav_menu()的函数，其中包含此函数：

<ul>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>

但是因为我也在使用Foundation框架，所以菜单标签已经有了一些预构建类。所以我的主菜单看起来像这样：

<div class="top-bar" id="main-menu">
            <ul class="menu vertical medium-horizontal expanded medium-text-center" data-responsive-menu="drilldown medium-dropdown">
                <li><a href="#">Tech</a>
                </li>
                <li><a href="#">Energy</a>
                </li>
                <li><a href="#">Space</a>
                </li>
                <li ><a href="#">Medicine</a>
                </li>
                <li ><a href="#">Robotics</a>
                </li>
                <li ><a href="#">Tesla</a>
                </li>
            </ul>
        </div>

所以为了在这里安装wp_nav_menu()函数，我必须这样做：

<div class="top-bar" id="main-menu">
            <?php 
                $args = array(
                    'theme_location' => 'top'
                );
            ?>
            <?php wp_nav_menu($args); ?>
        </div>

但问题是因为我已从菜单元素中删除了类名和样式表，导航将无法独行响应！

那么如何添加这个Wordpress函数来安装预构建类的菜单？

Answer 1

你应该尝试阅读这些问题的文档，因为WordPress文档非常广泛且非常好。

https://developer.wordpress.org/reference/functions/wp_nav_menu/

要解决此问题，请在'theme_location' => 'top'下方添加'menu_class' => 'menu vertical medium-horizontal expanded medium-text-center'。所以你的最终代码将是：

<div class="top-bar" id="main-menu">
        <?php 
            $args = array(
                'theme_location' => 'top',
                 'menu_class' => 'menu vertical medium-horizontal expanded medium-text-center'
            );
        ?>
        <?php wp_nav_menu($args); ?>
    </div>

Answer 2

尝试：

 $args = array(
        'theme_location' => 'top'
        'menu_class' => 'menu vertical medium-horizontal expanded medium-text-center',        
    );
    wp_nav_menu( $args );

如果您还需要数据响应菜单，可以使用一些js添加它。

修改

在$ args中，你也可以使用这个

'items_wrap' => '<ul class="menu vertical medium-horizontal expanded medium-text-center" data-responsive-menu="drilldown medium-dropdown">%3$s</ul>';

Answer 3

这里是解决方案：

wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu', 'menu_id3' => 'primary-menu3' ) );

如何将类添加到wp_nav_menu（）函数

3 个答案: