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

知更鸟 WordPress202.9K阅读模式

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

<body class="archive category category-wordpress category-6 logged-in custom-background cat-6-id">文章源自知更鸟-https://zmingcx.com/add-category-id-body-post-class-wordpress.html

其中数字为该分类的ID号,前提是主题模板必须使用函数:文章源自知更鸟-https://zmingcx.com/add-category-id-body-post-class-wordpress.html

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

有了这个非常方便的功能,你就可以针对不同的分类定义不同的样式风格。文章源自知更鸟-https://zmingcx.com/add-category-id-body-post-class-wordpress.html

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

WordPress

将以下代码添加到您当前主题的 functions.php 文件:文章源自知更鸟-https://zmingcx.com/add-category-id-body-post-class-wordpress.html

  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';
  5.      return $classes;
  6. }
  7. add_filter('post_class', 'category_id_class');
  8. add_filter('body_class', 'category_id_class');

 文章源自知更鸟-https://zmingcx.com/add-category-id-body-post-class-wordpress.html

应用实例:文章源自知更鸟-https://zmingcx.com/add-category-id-body-post-class-wordpress.html

比如:HotNewspro主题,在分类ID为6的分类归档和文章页面隐藏热点文章(顶部的四张图片),可在主题样式文件style中添加:文章源自知更鸟-https://zmingcx.com/add-category-id-body-post-class-wordpress.html

  1. .cat-6-id, #top_hot {
  2.     displaynone;
  3.     }

一举反三,可以定义其它任意位置的文字大小,背景颜色等与其它分类不同。文章源自知更鸟-https://zmingcx.com/add-category-id-body-post-class-wordpress.html

原代码出处:http://www.trickspanda.com/2014/04/add-category-id-body-post-class-wordpress/文章源自知更鸟-https://zmingcx.com/add-category-id-body-post-class-wordpress.html 文章源自知更鸟-https://zmingcx.com/add-category-id-body-post-class-wordpress.html

weinxin
我的微信
版权声明
本站原创文章转载请注明文章出处及链接,谢谢合作!
评论  20  访客  18  作者  1
    • 磁县百科
      磁县百科 1

      不明觉厉!

      • 优团聚
        优团聚 1

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

        • kpopcomedy
          kpopcomedy 6

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

            • 知更鸟
              知更鸟

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

              1. .logo {
              2.     background:url(images/logo.png) no-repeat;
              3.     floatleft;
              4.     width350px;
              5.     height53px;
              6.     margin5px 0 0 5px;
              7.     text-indent: –10000px;
              8.     cursor:pointer;
              9.     }

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

            • wmtimes
              wmtimes 7

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

              • 润
                5

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

                • kpopcomedy
                  kpopcomedy 6

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

                  • 风口上的树
                    风口上的树 3

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

                    • kpopcomedy
                      kpopcomedy 6

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

                      • hjrhclan
                        hjrhclan 0

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

                        • 小林子
                          小林子 1

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

                          • 龙笑天
                            龙笑天 5

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

                              • 龙笑天
                                龙笑天 5

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

                              • 郝
                                1

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

                              匿名

                              发表评论

                              匿名网友 填写信息

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

                              确定