将“active”类添加到当前单页wordpress的li中

Question

寻求您的帮助和建议。 我在Wordpress中有<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;libraries=geometry"></script> <div id="map"></div>的链接列表。我需要将课程single仅限于活动页面的li。

应该像这张图片

但它是：

我的wp代码：

active

Answer 1

这不是在Wordpress中进行菜单的正确方法。您应该使用wp_nav_menu而不是自定义WP_Query。

首先，在 functions.php 中将以下内容添加到register a new menu：

add_action('after_setup_theme', 'register_my_menu');
function register_my_menu() {
  register_nav_menu('skills_menu', __( 'Skills menu', 'your-theme-name' ));
}

然后登录您的管理，您将在外观＆gt;下看到新的菜单展示位置。菜单。为该展示位置创建一个新菜单 - 您可以自动将顶级新页面添加到此菜单中。

然后在模板中添加以下内容以显示菜单：

<?php wp_nav_menu(array('theme_location' => 'skills_menu')); ?>

Wordpress will automatically handle the active class将current-menu-item添加到相应的li。不需要任何过滤器。

Answer 2

使用Javascript/jQuery

找到我的问题的答案

jQuery(document).ready(function($){
var pgurl = window.location.href;
$("ul.skill-items li").each(function(){
  if($(this).find('a').attr("href") == pgurl || $(this).find('a').attr("href") == '' )
    $(this).addClass("active");
})
});

pgurl包含您当前的网址。在此之后，我们正在寻找anchor及其链接的每个项目。然后我们将对这些链接进行合并，如果它们相同，我们会将类active添加到li

Answer 3

你可以试试这个：

function my_alter_classes_on_li( $classes, $item ){
    global $post;
    if( in_array( $post->post_type, $classes ) ) $classes[] = 'current-menu-item';
    return $classes;
}
add_filter( 'nav_menu_css_class', 'my_alter_classes_on_li', 10, 2 );