hexo next 新增阅读排行页面

新增一个阅读排行页面,可以现在本站文章的阅读排行榜,基于 leancloud 的数据实现。

新建页面

hexo n page top 新建页面,会生成 top 目录,编辑其中自动生成的 index.md 文件,将其中的代码替换如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<div id="top"></div>
<script src="https://cdn1.lncld.net/static/js/av-core-mini-0.6.4.js"></script>
<script>AV.initialize("leancloud_appid", "leancloud_appkey");</script>
<script type="text/javascript">
var time=0
var title=""
var url=""
var query = new AV.Query('Counter');
query.notEqualTo('id',0);
query.descending('time');
query.limit(1000);
query.find().then(function (todo) {
for (var i=0;i<1000;i++){
var result=todo[i].attributes;
time=result.time;
title=result.title;
url=result.url;
// var content="<a href='"+"https://hoxis.github.io"+url+"'>"+title+"</a>"+"<br>"+"<font color='#fff'>"+"阅读次数:"+time+"</font>"+"<br><br>";
var content="<p>"+"<font color='#1C1C1C'>"+"【文章热度:"+time+"℃】"+"</font>"+"<a href='"+"https://hoxis.github.io"+url+"'>"+title+"</a>"+"</p>";
document.getElementById("top").innerHTML+=content
}
}, function (error) {
console.log("error");
});
</script>

并将其中的 leancloud_appidleancloud_appkey 和页面链接替换为你的。

配置菜单显示

编辑主题配置文件 themes\next\_config.yml,添加 top:

1
2
3
menu:
home: / || home
top: /top/ || signal

新增菜单栏的显示名称 hexo/theme/next/languages/zh-Hans.yml,同样新增 top 对应的中文:

1
2
3
4
5
6
7
8
9
10
11
12
menu:
home: 首页
archives: 归档
categories: 分类
tags: 标签
about: 关于
search: 搜索
schedule: 日程表
sitemap: 站点地图
commonweal: 公益404
resources: 资源
top: 阅读排行

最后,hexo d -g 部署后可以显示。

阅读排行榜

hoxis wechat
一个脱离了高级趣味的程序员,关注回复1024有惊喜~
赞赏一杯咖啡
  • 本文作者: hoxis | 微信公众号【不正经程序员】
  • 本文链接: https://hoxis.github.io/hexo-next-read-rank.html
  • 版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 3.0 许可协议。转载请注明出处!
  • 并保留本声明和上方二维码。感谢您的阅读和支持!
0%