添加“动态标识当前导航页”的判断语句

29 八月, 2009

每一次折腾一个东西后，都会有冲动写成文，告诉或是分享给大家，可也每每发现这题目很难表述，说不清！所以，我们还是来看看到底是啥东东吧：

之前，只有鼠标移到“折腾WP”上时，才会出现此效果，这是利用CSS的hover属性实现。而现在是在“折腾WP”分页时就突出显示原hover样式，这利用了一句php的判断语句：

<?php if ( is_category(6) ) { echo ' class="nav_hover"'; } ?>

把此判断语句添加至导航的li标签中：

<li<?php if ( is_category(6) ) { echo ' class="nav_hover"'; } ?>><a href="<?php bloginfo('url'); ?>/wordpress">折腾WP</a></li>

添加后会有什么效果呢？就是检测当前是否为ID=6的分类页，是的则添加class属性”nav_hover” 到li标签中，这样就简单实现了“动态标识当前导航页”了！

更多其他判断语句：

is_page , is_home() , is_category() , is_archive() , is_search() , is_single() , is_date()

再以“关于”页面为例，简单说个步骤：

1.查询到关于页面的ID，到后台页面编辑中即可获知，我的关于页面ID为258；

2.添加判断语句至li标签中：

<?php if ( is_page(258) ) { echo ' class="nav_hover"'; } ?>

<li<?php if ( is_page(258) ) { echo ' class="nav_hover"'; } ?>><a href="<?php bloginfo('url'); ?>/about">关于此地</a></li>

3.更新文件即可！

文末说说个人感觉，这样做可以让访客清楚地明白自己在网站的哪个页面中，到底有啥好处呢？仁者见仁智者见智啦，各位童鞋！

41 评论

老饕：
2009/8/29 14:33:14 #1

回复
哈哈，抢沙发！
laofan ：
2009/8/29 14:53:14 #2

回复
枪板凳！连接已经改了
短歌行：
2009/8/29 16:53:16 #3

回复
为什么图看不到了，河蟹了吗？
- 林木木：
  
  回复
  @短歌行恩，我还是在使用Picasa，那个插件调用的国外主机流量超了……现在换了一个国外主机，OK了！
短歌行：
2009/8/29 16:54:16 #4

回复
原来是在标题上显示出某某人在哪个页面吧。
zwwooooo ：
2009/8/29 16:55:16 #5

回复
早想加，但一直不知道怎么实现，也就忘了
- 林木木：
  
  回复
  @zwwooooo 我浙江电信，访问你的网站还是些跟目录诶……
志言：
2009/8/29 17:01:17 #6

回复
不是很明白啊
- 林木木：
  
  回复
  @志言哎，图挂了就是麻烦那……
巴黎春天：
2009/8/29 18:18:18 #7

回复
恕我直言，你的导航栏不耐看。
- 林木木：
  
  回复
  @巴黎春天暂时没好的样式出现在脑子里诶，请赐教~~呵呵
OKHENG ：
2009/8/29 19:40:19 #8

回复
居然没抢到沙发啊~，╮(╯▽╰)╭
雅蠛蝶~~~~~~~~~~~
OKHENG ：
2009/8/29 19:41:19 #9

回复
是啊，导航条不怎么好看，我比较喜欢那种有金属质感的，偶也。雅蠛蝶~
- Deloz ：
  
  回复
  汗.
- 林木木：
  
  回复
  @OKHENG 狂汗，八嘎！
万戈：
2009/8/30 15:20:15 #10

回复
真可惜，我的主题自带的，没给我折腾的机会
- 林木木：
  
  回复
  @万戈嘻，那就折腾其他主题去，把喜欢的功能移植出来~
妖狐闪现：
2009/8/30 19:55:19 #11

回复
噢，看明白了，赞一个:-)
如果用wordpress自带的api来list category和page，那么点击某个分类后，这个li上会多一个current-cat/page的css类，不过你应该没用api:-)
- 林木木：
  
  回复
  @妖狐闪现恩，如果用WordPress自带的分类或页面的函数，出来的li列表前会有css类的，不过我是一直是把导航写成固定链接形式的了~
巴黎春天：
2009/8/31 10:03:10 #12

回复
那就提点意见吧，看你整个主题基本只是用框框的元素，单调，建议你看看其他简洁版的主题，吸收经验。
- 林木木：
  
  回复
  @巴黎春天先说声谢谢，但我想说的是，现在这一风格是我“吸取了一年的经验”自己设计自己重写CSS代码折腾出来了，请还在完全使用别人的主题的人绕道，谢谢！
  - 巴黎春天：
    
    回复
    晕，给你提点意见都无法接受。。。
    “请还在完全使用别人的主题的人绕道”……
    自己做主题就很NB？……。。。。要做自己做还不简单。。。现在会电脑的IT民工大把多。。。
  - 巴黎春天：
    
    回复
    赫赫，声明，我完全没有恶意。
aunsen ：
2009/8/31 14:40:14 #13

回复
嗯，比较有柴！
- 林木木：
  
  回复
  @aunsen 不知道够不够烧的……哈哈
林木木：
2009/8/31 17:22:17 #14

回复
@巴黎春天我跟你说，也许是个性使然，我非常不喜欢一来就说“恕我直言，你的导航栏不耐看”，再说明白点，我这人最不喜欢别人对我认真做出来的东西说这不好那不好，却又说不出自己的想法的人！任何一个东西总是有那么些不足的地方的，也总有那么些人是不喜欢的。所以，请你以后在指出别人不足的同时提出自己的修改意见或者方向，不然又怎样？只会使人（或者说像我这样的人）产生厌恶，真的，我也说认真的！
Mr.Sam ：
2009/9/2 13:14:13 #15

回复
能不能把li<?php if ( is_category(6) )中的6去掉然后对所有分类都有效？
- 林木木：
  
  回复
  @Mr.Sam YES！赶快试试吧~
  - Mr.Sam ：
    
    回复
    我不知道为什么失败了。琢磨中。
happyet ：
2009/9/2 15:43:15 #16

回复
需要这么复杂么？
- 林木木：
  
  回复
  @happyet 不复杂吧？就是加了个判断语句嘛。
林木木：
2009/9/2 21:39:21 #17

回复
@Mr.Sam 你导航用的是分类列表调用函数吧？我这直接写固定链接的。还有CSS要写准确！可以加我QQ：41548682
起衣：
2009/9/3 00:38:0 #18

回复
正找这个哈,一来就看到了~~
- 林木木：
  
  回复
  @起衣哇，你真幸运的，我刚写不久！
  - 起衣：
    
    回复
    咱运气好~~~
我心疯狂：
2009/10/28 18:57:18 #19

回复
潜水那么久，终于留个脚丫咯
- 林木木：
  
  回复
  哇，你那好多好东东呀，不过貌似都英文的……
  - 我心疯狂：
    
    回复
    不是全英文啊~~~~最近更新的是英文的！
    - 林木木：
      
      回复
      哦，好好淘淘，嘻嘻~
      - 我心疯狂：
        
        回复
        资源陆续更新哦！
        挺奇怪的，怎么刚才上条留言现在才看到，害我又去留言！
我心疯狂：
2009/10/28 19:29:19 #20

回复
不是全英文的！

发表评论取消回复

< >

木木木木木

添加“动态标识当前导航页”的判断语句

发表评论 取消回复

发表评论取消回复