使用库:参考 http://wangwlj.com/2018/01/09/blog_pin_post/

目前已经有修改后支持置顶的仓库,可以直接用以下命令安装。(cmd 到博客根目录,nmp运行)

  1. $ npm uninstall hexo-generator-index --save
  2. $ npm install hexo-generator-index-pin-top --save

然后在需要置顶的文章的Front-matter中加上top: true即可。比如下面这篇文章:

  1. ---
  2. title: hexo+GitHub博客搭建实战
  3. date: 2017-09-08 12:00:25
  4. categories: 博客搭建系列
  5. top: true
  6. ---

到目前为止,置顶功能已经可以实现了。

设置置顶标志

打开:/blog/themes/next/layout/_macro 目录下的post.swig文件,定位到

标签下,插入如下代码:

  1. {% if post.top %}
  2. <i class="fa fa-thumb-tack"></i>
  3. <font color=7D26CD>置顶</font>
  4. <span class="post-meta-divider">|</span>
  5. {% endif %}

简单方法:可能有问题

参考 https://zhwhong.cn/2017/03/23/deal-with-hexo-article-top-problem/

原理:在Hexo生成首页HTML时,将top值高的文章排在前面,达到置顶功能。

修改Hexo文件夹下的node_modules/hexo-generator-index/lib/generator.js,在生成文章之前进行文章top值排序。

需添加的代码:

  1. posts.data = posts.data.sort(function(a, b) {
  2. if(a.top && b.top) { // 两篇文章top都有定义
  3. if(a.top == b.top) return b.date - a.date; // 若top值一样则按照文章日期降序排
  4. else return b.top - a.top; // 否则按照top值降序排
  5. }
  6. else if(a.top && !b.top) { // 以下是只有一篇文章top有定义,那么将有top的排在前面(这里用异或操作居然不行233)
  7. return -1;
  8. }
  9. else if(!a.top && b.top) {
  10. return 1;
  11. }
  12. else return b.date - a.date; // 都没定义按照文章日期降序排
  13. });

修改完成后,只需要在front-matter中设置需要置顶文章的top值,将会根据top值大小来选择置顶顺序top值越大越靠前。需要注意的是,这个文件不是主题的一部分,也不是Git管理的,备份的时候比较容易忽略。

以下是最终的generator.js内容

  1. 'use strict';
  2. var pagination = require('hexo-pagination');
  3. module.exports = function(locals) {
  4. var config = this.config;
  5. var posts = locals.posts.sort(config.index_generator.order_by);
  6. posts.data = posts.data.sort(function(a, b) {
  7. if(a.top && b.top) {
  8. if(a.top == b.top) return b.date - a.date;
  9. else return b.top - a.top;
  10. }
  11. else if(a.top && !b.top) {
  12. return -1;
  13. }
  14. else if(!a.top && b.top) {
  15. return 1;
  16. }
  17. else return b.date - a.date;
  18. });
  19. var paginationDir = config.pagination_dir || 'page';
  20. return pagination('', posts, {
  21. perPage: config.index_generator.per_page,
  22. layout: ['index', 'archive'],
  23. format: paginationDir + '/%d/',
  24. data: {
  25. __index: true
  26. }
  27. });
  28. };

HEXO添加置顶功能的更多相关文章

  1. PHPCMS实现文章置顶功能的方法

    我个人喜欢把PHPCMS当作博客来用,而作为一个博客,怎能少了文章置顶功能呢?其中用PHPCMS实现置顶功能非常简单,无非是修改下推荐位的名称为置顶,然后在文章列表中推送需要置顶的文章罢了. 不过博客 ...

  2. Android自定义ScrollView实现一键置顶功能

    效果图如下: (ps:动态图有太大了,上传不了,就给大家口述一下要实现的功能吧) 要实现的功能:当ScrollView向上滑动超过一定距离后,就渐变的出现一个置顶的按钮,当滑动距离小于我们指定的距离时 ...

  3. IOS 作业项目 TableView两个section中cell置顶功能实现

    点击cell会置顶,其他的下移

  4. QT 窗口置顶功能

    Qt中,保持窗口置顶的设置为: Qt::WindowFlags m_flags = windowFlags(); setWindowFlags(m_flags | Qt::WindowStaysOnT ...

  5. sql 置顶功能的查询

    sql中有置顶的需求,文章很多条,分页查询,要求置顶的在最前面: 只需要使用: order by 置顶字段 即可

  6. php 排序和置顶功能实现

    (1)排序操作思路 一般来说都是按照发布时间排序.时间戳大的靠前,所以用倒序desc,而不是asc (2)置顶操作思路: 点击置顶时,修改数据库addtime字段值为当前时间即可.因为排序是按照时间戳 ...

  7. jquery实现页面置顶功能代码

    <html> <head> <title></title><script type='text/javascript> //回到顶部功能 f ...

  8. jquery实现标签上移、下移、置顶

    eg:如在后台的标签列表中,实现上移.下移.置顶功能 思路: 1.先用到的克隆方法.clone(true): 即把当前要移动的项先保存好,备于后用. 2.找到当前标签所对应的相关元素及其相关方法: 如 ...

  9. winform窗体置顶

    winform窗体置顶 金刚 winform 置顶 今天做了一个winform小工具.需要设置置顶功能. 网上找了下,发现百度真的很垃圾... 还是必应靠谱些. 找到一个可以链接. https://s ...

随机推荐

  1. 基于Asp.Net Core 5.0依赖Quartz.Net框架编写的任务调度web管理平台

    源码地址: https://github.com/246850/Calamus.TaskScheduler 演示地址:http://47.101.47.193:1063/ 1.Quartz.NET框架 ...

  2. mastercam2018安装教程

    安装前先关闭杀毒软件和360卫士,注意安装路径不能有中文,安装包路径也不要有中文. [安装环境]:Win7/Win8/Win10 1.选中[Mastercam2018]压缩包,鼠标右击选择[解压到Ma ...

  3. JAVA获取当前文件路径this.getClass().getResource方法详细讲解

    public class Test { public void run() { // TODO Auto-generated method stub System.out.println(" ...

  4. django之orm单表查询

    这几天重新学习了一下django的orm,以此作为记录来分享. Part1:修改配置,生成表 在写数据和查数据之前,首先先得把django配置一下,具体配置如下: 1.先在公共项目的settings中 ...

  5. Socket的用法——NIO包下SocketChannel的用法 ———————————————— 版权声明:本文为CSDN博主「茶_小哥」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。 原文链接:https://blog.csdn.net/ycgslh/article/details/79604074

    服务端代码实现如下,其中包括一个静态内部类Handler来作为处理器,处理不同的操作.注意在遍历选择键集合时,没处理完一个操作,要将该请求在集合中移除./*模拟服务端-nio-Socket实现*/pu ...

  6. python 11 模块

    模块 在计算机程序的开发过程中,随着程序代码越写越多,在一个文件里代码就会越来越长,越来越不容易维护. 为了编写可维护的代码,我们把很多函数分组,分别放到不同的文件里,这样,每个文件包含的代码就相对较 ...

  7. 11.15 gryz校测(题解分析报告)

    T1 心有灵犀 (cooperate) 题目大意 给你一个不超过 \(10^9\) 的数字 \(n\) 和一个交换次数上限 \(k\), 每次操作对这个 数字 \(n\) 的其中两位进行交换, 比如 ...

  8. QTREE----树剖

    题目内容: ---------------------------------------------------- Query on a tree Time Limit: 851MS   Memor ...

  9. SpringMVC听课笔记(十:处理JSON: 使用HttpMessageConverter)

    1. 处理JSON 2. 原理 流程图 3. 看个应用吧 -- 上传 ①jsp ②handler -- 下载 ① jsp ② handler

  10. Redis常见配置文件详解

    Redis常见配置文件详解 # vi redis.conf 1 2 3 daemonize yes #是否以后台进程运行 4 5 pidfile /var/run/redis/redis-server ...