按WordPress分类ID为页面添加相应的class

知更鸟
知更鸟
知更鸟
1530
文章
6916
评论
更多
 2014年5月7日16:25:25 20 2.5K

这段代码通过判断WordPress分类ID，自动在分类页面和文章页面的<body> 标签中添加“cat-6-id”例如：

<body class="archive category category-wordpress category-6 logged-in custom-background cat-6-id">

其中数字为该分类的ID号，前提是主题模板必须使用函数：

  1. <body <?php body_class(); ?>>

有了这个非常方便的功能，你就可以针对不同的分类定义不同的样式风格。

按WordPress分类ID为页面添加相应的class

WordPress

将以下代码添加到您当前主题的 functions.php 文件:

  1. function category_id_class($classes) {
  2.      global $post;
  3.           foreach((get_the_category($post->ID)) as $category)
  4.                $classes [] = 'cat-' . $category->cat_ID . '-id';
  6.      return $classes;
  7. }
  9. add_filter('post_class', 'category_id_class');
  10. add_filter('body_class', 'category_id_class');

 

应用实例：

比如：HotNewspro主题，在分类ID为6的分类归档和文章页面隐藏热点文章（顶部的四张图片），可在主题样式文件style中添加：

  1. .cat-6-id, #top_hot {
  2.     display: none;
  3.     }

一举反三，可以定义其它任意位置的文字大小，背景颜色等与其它分类不同。

原代码出处：http://www.trickspanda.com/2014/04/add-category-id-body-post-class-wordpress/

历史上的今天
五月
7
weinxin
关于本站
分享交流WordPress经验与技巧，关注前端设计与网站制作。仅用于功能演示。
获取本主题
售前咨询加Q：598845006
多功能主题 Begin
重定向wp-login.php登录到指定页面 WordPress

重定向wp-login.php登录到指定页面

如果你的WordPress网站已有前端登录注册功能，不想让其他人访问wp-login.php登录页面，并且当访问WordPress默认登录页面时重定向到指定的页面，比如前端登录注册页面等，可以通过下面...
05月24日 410 5
WordPress 5.4.1安全更新、中文版下载 WordPress

WordPress 5.4.1安全更新、中文版下载

WordPress 5.4.修补了7个安全漏洞，并修正了17个问题。这些漏洞存在于 WordPress 版本 5.4 和更早版本，WordPress 3.7 以后的所有版本都已修补安全漏洞，建议立即更...
04月30日 2K 9
让WordPress视频播放插件Smartideo支持B站BV号 Plugins

让WordPress视频播放插件Smartideo支持B站BV号

B站（bilibili）近期调整视频链接ID为BV开头，B站说是为了保护稿件信息安全，容纳更多投稿，维护UP主的权益。但升级后的链接造成WordPres视频播放插件Smartideo中的正则无法获取由...
04月10日 2.1K 24
B站BV号链接转av号 WordPress

B站BV号链接转av号

之前用Smartideo插件转载B站视频，只需要复制粘贴视频地址到文章中就可以了，B站是目前唯数不多没广告的视频站点了，不过最近B站视频链接后缀ID号从av变成BV开头，插件的功能失效。 已有用户向插...
04月08日 1K 8
获取本主题
售前咨询加Q：598845006
多功能主题 Begin
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

评论：20   其中：访客  18   博主  1   引用   1
    • 磁县百科 磁县百科 1
      2014年5月7日 17点30分 1F
      回复

      不明觉厉！

      • 优团聚 优团聚 1
        2014年5月9日 23点08分 2F
        回复

        很好，正在学习中，支持。

        • kpopcomedy kpopcomedy 6
          2014年5月10日 14点36分 3F
          回复

          鸟哥，请问你的class=logo这个是在哪个位置定义的？，想把logo这个class改小点

            • 知更鸟 知更鸟
              2014年5月11日 09点22分 B1
              回复

              @ kpopcomedy 打开主题style样式文件：

              1. .logo {
              2.     background:url(images/logo.png) no-repeat;
              3.     float: left;
              4.     width: 350px;
              5.     height: 53px;
              6.     margin: 5px 0 0 5px;
              7.     text-indent: –10000px;
              8.     cursor:pointer;
              9.     }

              修改其中的：
              width: 350px;
              height: 53px;

            • wmtimes wmtimes 7
              2014年5月10日 15点33分 4F
              回复

              看来文章也可以这么来了。

              • 润 润 5
                2014年5月10日 22点28分 5F
                回复

                鸟哥。首页友情链接超过20个了，添加其他的连接。首页不显示。怎么办呢？

                • kpopcomedy kpopcomedy 6
                  2014年5月14日 00点18分 6F
                  回复

                  鸟哥，导航栏下方的字怎么去掉呢？我把head.php里对应显示时间的哪行代码删掉之后，只剩下“登录”两个字了，可是代码没有直接显示登录，然后就不晓得怎么办了。

                  • 风口上的树 风口上的树 3
                    2014年5月15日 21点49分 7F
                    回复

                    鸟哥的主页最近怎么老是变来变去的啊

                    • kpopcomedy kpopcomedy 6
                      2014年5月16日 20点13分 8F
                      回复

                      把微博去掉了，把class（logo）也改小了，但是logo图片旁边还是有一块空白区域是首页链接呢

                      • hjrhclan hjrhclan 0
                        2014年7月1日 10点38分 9F
                        回复

                        如果一篇文章有很多分类呢？

                        • 小林子 小林子 1
                          2015年1月15日 22点33分 10F
                          回复

                          鸟哥 ，求Wordpress首页不显示指定首页的文章的解决办法？最新文章列表仍显示

                          • 龙笑天 龙笑天 5
                            2015年12月24日 00点54分 11F
                            回复

                            你好，请问这个分类id数字6加到这个函数的哪个地方呢？

                              • 龙笑天 龙笑天 5
                                2015年12月24日 01点00分 B1
                                回复

                                @ 龙笑天 哦，知道了，这个函数的意思是给 所有的 分类及分类文章的body加上cat-id数字-id这个class………

                              • 郝 郝 1
                                2017年6月18日 17点52分 12F
                                回复

                                我想请教下，我建分类目录时候，ID怎么都不是2怎么办呢？新建分类目录 1345678 都有就是分类目录ID没有2，是什么原因呢？谢谢