腾讯云服务器优惠活动华纳云香港服务器

非常实用的WordPress同分类文章列表小工具教程

WordPress主题推荐

WordPress 小工具是一个非常实用的功能,其可视化的后台设置无论是对新手还是大神都非常的方便快捷。通过各种小工具的点缀,可以让 WordPress 主题更加的多样化和个性化。今天飞鸟给大家带来一款 雅兮网原创“WordPress 同分类文章列表小工具”。

非常实用的WordPress同分类文章列表小工具教程-第1张-boke112百科(boke112.com)

顾名思义:显示与目前文章相同分类下的其他文章,以列表形式展现。并通过数量、时段、排序依据等来实现不同的列表,其前端效果如下(前端效果在不同的主题上略有区别,仅供参考。后续版本会增加其它前端样式)。

非常实用的WordPress同分类文章列表小工具教程-第2张-boke112百科(boke112.com)

小工具特点:

  • 前端简洁美观,符合大众审美;
  • 自定义标题,配合不同排序实现多样化小工具;
  • 自定义数量,控制权完全在你手中;
  • 自定义时段,可选一年、一月等多个时段,用户体验为王;
  • 自定义排序,发布时间、更新时间、随机等多种排序方式。
非常实用的WordPress同分类文章列表小工具教程-第3张-boke112百科(boke112.com)

自定义时段

非常实用的WordPress同分类文章列表小工具教程-第4张-boke112百科(boke112.com)

自定义排序

注意事项:按照阅读量排序需主题自带浏览量功能或实用阅读量记录插件,且以自定义栏目记录阅读量,自定义栏目名称为 views,否则可能会导致排序错误。建议只在文章也是用本小工具,否则可能会无法正常显示。

使用方法:

下载本文后方提供的widget-catpost.php,放入你的主题小工具文件/文件夹中,并适当引用,将下文提供的 css 代码放入你的 style.css 文件中

附:常见的小工具使用方法:

方法一:如果你的主题有专门的小工具文件夹如 widget 文件夹,可以将本小工具文件直接放入,并在 functions.php 引用该文件(也有在小工具文件夹中自定义一个 index.php,该文件已被 functions.php 引用,此时只需要在 index.php 引用 widget-catpost.php 即可)。方法二:没有专门的文件夹,只有 widgets.php 文件直接拿出 widget-catpost.php 文件中的代码,放入 widgets.php 中即可。

方法三:将 widget-catpost.php 放入适当的文件夹,并在 functions.php 调用该文件即可。

CSS代码参考

  1. /* 同分类文章小工具样式 by 雅兮网 yaxi.net */
  2. .cat-post{
  3. width: 100%;
  4. overflow:hidden;
  5. }
  6. .cat-post ul{
  7. padding: 15px;
  8. }
  9. .cat-post ul li{
  10. width: 99%;
  11. line-height: 28px;
  12. white-space: nowrap;
  13. word-wrap: normal;
  14. text-overflow: ellipsis;
  15. overflow: hidden;
  16. }
  17. .cat-post ul li a{
  18. font-size: 14px;
  19. }
  20. .cat-post ul li a i{
  21. font-size: 12px;
  22. margin-right: 5px;
  23. }

题外话:本小工具的开发参考了其他作者如知更鸟等大神的代码,算是站在巨人的肩膀上完成的。后续还会新增前端样式、设置等其他功能。如果你有兴趣,敬请期待吧。

赞 (0) 打赏
版权声明:本文为投稿文章,感谢 雅兮网 的投稿,版权归原作者所有!发布此文是出于传递更多信息之目的,若有来源标注错误或侵犯了您的合法权益,请联系我们,确认后马上更正或删除,谢谢!
wu