我们都知道wordpress已经集成了一些通用的css样式,比如wp-nav-menu菜单会有很多的class,不想看到那么多的选择器,想要清净的世界要如何操作呢?随ytkah一起来看看

<li id="menu-item-6" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-6"><a href="https://www.cnblogs.com/ytkah">首页</a></li>
<li id="menu-item-13" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-13"><a href="/news">WordPress资讯</a></li>
<li id="menu-item-8" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-8"><a href="/themes">WordPress主题</a></li>

  将下面的代码添加到主题的 functions.php就可以实现效果

/**
* 移除菜单的多余CSS选择器
*/
add_filter('nav_menu_css_class', 'my_css_attributes_filter', 100, 1);
add_filter('nav_menu_item_id', 'my_css_attributes_filter', 100, 1);
add_filter('page_css_class', 'my_css_attributes_filter', 100, 1);
function my_css_attributes_filter($var) {
return is_array($var) ? array() : '';
}

  输出效果如下,是不是很干净?

<li><a href="https://www.cnblogs.com/ytkah">首页</a></li>
<li><a href="/news">WordPress资讯</a></li>
<li><a href="/themes">WordPress主题</a></li>

  But!!!有些网友说想保留一些CSS选择器,比如高亮显示当前菜单,那又要怎么操作呢?只要不过滤它们即可,常见的当前菜单的选择器有以下4个:current-post-ancestor, current-menu-ancestor, current-menu-item, current-menu-parent,只要将这些class加入array中就可以

/**
* 移除菜单的多余CSS选择器
*/
add_filter('nav_menu_css_class', 'my_css_attributes_filter', 100, 1);
add_filter('nav_menu_item_id', 'my_css_attributes_filter', 100, 1);
add_filter('page_css_class', 'my_css_attributes_filter', 100, 1);
function my_css_attributes_filter($var) {
return is_array($var) ? array_intersect($var, array('current-menu-item','current-post-ancestor','current-menu-ancestor','current-menu-parent')) : '';
}

  输出效果如下

<li class="current-menu-item"><a href="https://www.cnblogs.com/ytkah">首页</a></li>
<li><a href="/news">WordPress资讯</a></li>
<li><a href="/themes">WordPress主题</a></li>

  不会那么复杂吧?

  上面这个方法只能定义li,如果想定义ul怎么操作呢?你一定会喜欢这篇文章:如何定义wordpress菜单wp-nav-menu中的ul呢

删除WordPress菜单wp-nav-menu中li的class或id样式的更多相关文章

  1. Wordpress菜单函数wp_nav_menu各参数详解及示例

    Wordpress菜单函数wp_nav_menu各参数详解及示例   注册菜单 首先要注册菜单,将以下函数添加至function.php函数里   register_nav_menus(array( ...

  2. 鼠标经过导航中li时,一个彩色模块跟着鼠标移动

    1.鼠标经过导航中li时,一个活动的li跟随鼠标移动,最终移动到鼠标的停留的位置.(如需鼠标离开后让活动的li回到初始位置,则用jq hover事件,当鼠标离开时,给活动的li设置left是0) 2. ...

  3. 菜单设计器(Menu Designer)及其B/S,C/S双重实现(B/S开源)

    ERP/MIS开发 菜单设计器(Menu Designer)及其B/S,C/S双重实现(B/S开源)   一直从事ERP/MIS的开发工作,今天来展现一下菜单设计器的设计,及其用途,并对B/S部分代码 ...

  4. 菜单之一:Menu基础内容

    参考<疯狂android讲义>2.10节P168 1.重要接口 Android菜单相关的重要接口共有以下四个: 其中Menu为普通菜单,SubMenu包含子项,ContextMenu当长时 ...

  5. 跟我一起学extjs5(13--运行菜单命令在tabPanel中显示模块)

    跟我一起学extjs5(13--运行菜单命令在tabPanel中显示模块)         上面设计好了一个模块的主界面,以下通过菜单命令的运行来把这个模块增加到主界面其中. 在MainModule. ...

  6. 自定义鼠标右键(层叠式菜单:cascading menu)

    Author:KillerLegend From:http://www.cnblogs.com/killerlegend/p/3575391.html Date:Tuesday, February 1 ...

  7. 菜单之一:Menu基础内容 分类: H1_ANDROID 2013-11-03 00:23 906人阅读 评论(0) 收藏

    参考<疯狂android讲义>2.10节P168 1.重要接口 Android菜单相关的重要接口共有以下四个: 其中Menu为普通菜单,SubMenu包含子项,ContextMenu当长时 ...

  8. WPF 4 Ribbon 开发 之 应用程序菜单(Application Menu)

    原文:WPF 4 Ribbon 开发 之 应用程序菜单(Application Menu)      在上一篇中我们完成了快捷工具栏的开发,本篇将讲解应用程序菜单开发的相关内容.如下图所示,点击程序窗 ...

  9. IE6/IE7中li底部4px空隙的Bug

    当li的子元素中有浮动(float)时,IE6/IE7中<li>元素的下面会产生4px空隙的bug. 代码如下: <ul class="list"> < ...

随机推荐

  1. activiti学习2:示例工程activiti-explorer.war的使用

    目录 activiti学习2:示例工程activiti-explorer.war的使用 一.搭建开发环境 二.运行示例工程 三.示例工程功能演示 1. 创建流程图 2. 部署流程图 3. 启动流程 4 ...

  2. TP3.2 日期默认格式

    <input type="text" id="create_time" name="create_time" required=&qu ...

  3. Word 插入目录详细教程 -- 视频教程(6)

    >> 视频教程链接:B站,速度快,清晰 更多关于插入目录的方法,参看:Word插入目录系列 未完 ...... 点击访问原文(进入后根据右侧标签,快速定位到本文)

  4. js中常用的获得日期对象的方法

    // 默认是当前时区的日期和时间 var date = new Date(); // 获取特定日期和时间的日期对象,需要传递毫秒数,不过可以传递规范日期格式字符串来代替 // 一些常见的日期格式 // ...

  5. 53 容器(八)——TreeMap 红黑树

    红黑树是比较难以理解的一种数据结构.它能从10亿数据中进行10几次比较就能查找到需要的数据.效率非常高. 理解起内部结构也难. 现阶段我们知道有这种东西就行了. 参考文章: https://www.j ...

  6. 关于 exynos 4412 按键中断 异步通知

    以下是驱动测试代码: //内核的驱动代码 #include <linux/init.h> #include <linux/module.h> //for module_init ...

  7. CentOS7 安装 Docker、最佳Docker学习文档

    目录 一.Docker支持 二.安装Docker -1.在新主机上首次安装Docker CE之前,需要设置Docker存储库.之后,就可以从存储库安装和更新Docker. 0.卸载旧版 1.正式安装 ...

  8. Drools 规则文件语法概述

    概述(Overview) 以.drl为扩展名的文件,是Drools中的规则文件,规则文件的编写,遵循Drools规则语法.下面详细介绍一下Drools规则文件语法.具体参考官方文档: https:// ...

  9. maven安装配置 每次都百度,麻烦

    JDK已经安装 1. 下载:https://maven.apache.org/download.cgi 2.  解压 D:\Program Files\maven 配置环境变量 新建环境变量MAVEN ...

  10. php中的htmlspecialchars_decode()函数

    htmlspecialchars_decode() 函数把一些预定义的 HTML 实体转换为字符. <?php $str = "This is some <b>bold&l ...