键盘实现WordPress翻页

2011年10月22日14:42:47 50 10,443
摘要

  如果能用键盘方向键实现上下翻页操作是不是会很方便,闲来无事,折腾一下键盘实现WordPress翻页功能。实现方法很简单,一段JS代码搞定
  将上面JS代码加到主题头部模版header.php或页脚模版footer.php中即可。按键盘上的左右方向键及Page UpPage Down试一下是不是很方便。上述代码可实现文章列表页面及正文上下篇翻页。
  另外,还有人专门为实现这一功能制作了插件:Easy keyboard shortcut navigation

如果能用键盘方向键实现上下翻页操作是不是会很方便,闲来无事,折腾一下键盘实现WordPress翻页功能。实现方法很简单,一段JS代码搞定。

  1. <?php wp_reset_query();if (is_home() || is_archive() || is_search()) { ?>   
  2. <script type="text/javascript">   
  3.     document.onkeydown = chang_page;function chang_page(e) {   
  4.         var e = e || event,   
  5.         keycode = e.which || e.keyCode;   
  6.         if (keycode == 33 || keycode == 37) location = '<?php echo get_previous_posts_page_link(); ?>';   
  7.         if (keycode == 34 || keycode == 39) location = '<?php echo get_next_posts_page_link(); ?>';   
  8.     }      
  9. </script>   
  10. <?php } ?>    
  11. <?php wp_reset_query();if (is_single()) { ?>   
  12. <script type="text/javascript">   
  13. document.onkeydown = chang_page;function chang_page(e) {   
  14.     var e = e || event,   
  15.     keycode = e.which || e.keyCode;      
  16.     if (keycode == 33 || keycode == 37) location = '<?php echo get_permalink(get_adjacent_post(false, '', false)); ?>';      
  17.     if (keycode == 34 || keycode == 39) location = '<?php echo get_permalink(get_adjacent_post(false, '', true)); ?>';      
  18. }      
  19. </script>      
  20. <?php } ?>   

将上面JS代码加到主题头部模版header.php或页脚模版footer.php中即可。按键盘上的左右方向键或Page Up和Page Down试一下是不是很方便。可实现文章列表页面及正文上下篇翻页。

不过正文键盘翻页会影响留言编辑时用键盘移动光标,所以可以把<?php wp_reset_query();if (is_single()) { ?> 及后面的删除,只在文章列表页面使用键盘翻页。

另外,还有人专门为实现这一功能制作了插件:Easy keyboard shortcut navigation,上述代码就是从中提取并修改而来,可能是因为一句JS代码可实现的功能,所以很少有人会使用这个插件,结果插件评分是零,呵呵。

weinxin
我的微信
分享交流WordPress经验与技巧,关注前端设计与网站制作。仅用于功能演示。
Begin主题购买
Begin主题购买

发表评论

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

目前评论:50   其中:访客  41   博主  7   引用   2

    • wmtimes 7

      嗯。到是不错的效果。

      • 分享互联网 2

        这个功能不错,谢谢。

        • shtion 3

          不错,已经折腾了,呵!

          • 歐塔庫 1

            這是好東西 感謝分享

            • 麻雀吧 1

              呵呵,这个功能不错,鸟哥折腾的好

              • Win7en乐园 8

                先学习着,努力学习!

                • qintag 1

                  哈哈,又发现好东西。。

                  • 传奇发布网 0

                    我现在才知道为什么我输了.

                    • 孤苏陌澜 3

                      鸟哥,好东西呀,这个很喜欢,谢啦,有了这个翻页跟小说似的!

                      • 扬州起源 3

                        好是好,但有时候一不小心按着左右键,就不知道翻哪里去鸟!!!
                        扬州起源-http://www.yzqiyuan.com

                        • 天堂下载 5

                          !!!赞叹!!!

                          • 明和超音波 2

                            真厉害..最近在学做站,这个翻页原来一段JS代码就可以了,看似不难,等下操作看看

                            • 小小鱼 4

                              这个很给力 自己想弄 可惜不懂····

                              • 闲逛的鱼 1

                                很感谢您的分享!

                                • Win7en乐园 8

                                  嘿嘿,感觉鸟哥可能会发布2.7正式版的补丁了。嘿嘿

                                  • Win7en乐园 8

                                    鸟哥,尚有一事不明。就是咱们在“关于我们,联系我们”的那个表单填写之后,发送的邮件标题是乱码,开始我以为是邮箱问题,所以换了gmail试了试还是这样的问题,而且我在我爱数码网上测试了下,也是同样的问题。额。。我不知道该如何是好了。

                                    • Lifeliker.com 3

                                      鸟哥,留言的时候出现这种情况是怎么回事?

                                      www.lifeliker.com

                                        • 知更鸟 Admin

                                          @Lifeliker.com 禁用所有插件试试

                                            • Lifeliker.com 3

                                              @知更鸟 试了,还是不行。
                                              怎么办?

                                              www.lifeliker.com

                                                • 知更鸟 Admin

                                                  @Lifeliker.com 我看你的静态插件WP-Super-Cache还在开着,估计就与它有关

                                                    • Lifeliker.com 3

                                                      @知更鸟 关了,插件也停用了,这次的错误是“错误:请输入评论内容。”又是怎么回事呢?
                                                      谢过。
                                                      www.lifeliker.com

                                                        • 知更鸟 Admin

                                                          @Lifeliker.com 实在不行,按下面
                                                          http://zmingcx.com/hotnewspro24-problem-summary.html
                                                          中的第54去掉ajax评论特效

                                                            • Lifeliker.com 3

                                                              @知更鸟 去了好像还是不行啊。。。
                                                              郁闷。。。。
                                                              劳烦你了鸟哥。谢谢啊!
                                                              www.lifeliker.com

                                                              • Lifeliker.com 3

                                                                @知更鸟 鸟哥,还有其他的解决办法吗?

                                                                  • 知更鸟 Admin

                                                                    @Lifeliker.com 汗,真去掉了?

                                                                    • Lifeliker.com 3

                                                                      @知更鸟 靠,去了没效果就加上去了。。。
                                                                      现在咋办?鸟哥

                                                                      www.lifeliker.com

                                                        • 我爱聊吧 4

                                                          鸟哥的JS玩的很溜哈

                                                          • 影楼团购 4

                                                            不错,学习了啊

                                                            • iy360 0

                                                              以前用过wordpress,很喜欢wordpress支持的很多特效,这个特效也是很有意思啊

                                                              • 朱宝祥 1

                                                                你太厉害了!!学习,偶像!

                                                                • 影楼课程培训团购 4

                                                                  不错学习了

                                                                  • 屈臣氏官网 5

                                                                    偶像!

                                                                    • 天文望远镜 0

                                                                      非常不错。。。这样做效果越来越给力了。。。

                                                                      • 最百科 0

                                                                        是俺写的插件,呵呵。俺的博客挂了几天,现在又复活了

                                                                        • 深邃的狮子座 2

                                                                          又发现好东西

                                                                          • ThePoweroflove 3

                                                                            好东西啊 收下了 不客气了

                                                                            • 胜芳办公椅 0

                                                                              又学到一种东西谢谢了!

                                                                              • citier 3

                                                                                这功能也实用,折腾下

                                                                                • Maxling 4

                                                                                  不错的功能!!!!谢谢鸟哥分享!!

                                                                                  • 笔丢了 2

                                                                                    呵呵,这个代码实用,搞小说阅读的一下就翻页也省的麻烦!

                                                                                    • hit9 3

                                                                                      这样方便不少。好久不来知更鸟了,别来无恙

                                                                                      • Adazi资讯网 3

                                                                                        果断收下,太好用了~~

                                                                                        • 番茄 2

                                                                                          果然很给力,已经折腾到我博客了。

                                                                                        • 来自外部的引用: 2

                                                                                          • WordPress翻页?用键盘吧! | wordpress吧
                                                                                          • 键盘实现WordPress翻页 ‹ 南通墙绘 麒麟手绘墙 |壁画|苏州|常熟|扬州|宿迁|泗洪|徐州