Hexo主题的置顶功能

February 02, 2017

忽然想要一个置顶功能，可惜原生的hexo-generator-index没有提供这样的方法，那只能自己搞一个了~

一、hexo-generator-index修改

Hexo排序编译组件，一般默认安装的，默认配置（按date排序）

index_generator:
  per_page: 10
  order_by: -date

如果没有安装的话，可执行：

$ npm install hexo-generator-index --save

在node_modules/lib/generator.js添加以下排序代码：

posts.data = posts.data.sort(function(a, b) {
    !a.top && (a.top = 0);
    !b.top && (b.top = 0);

    // 若top值一样则按照文章日期降序排，否则按照top值降序排
    if(a.top == b.top){
      return b.date - a.date; // 
    }else{
      return b.top - a.top; // 
    }
  });

二、日志配置

在Front-matter添加top属性

---
title: 我的2016
tags:
  - 总结
date: 2017-01-20 00:11:18
top: 1
---

三、置顶文案/样式设定

简单在日期边上加了个“置顶”的箭头~

添加一个模板theme/landscape/layout/_partial/post/top.ejs，判断当前日志是否有top属性（post.top）

<% if (post.top){ %>
    <i class="fa fa-arrow-up article-top"></i>
<% } %>

然后在你想添加的位置，引用该模板组件

blah blah ...

<%- partial('post/top') %>

blah blah ...

Reference: Netcan的《解决hexo置顶问题》

Hexo主题的置顶功能

.css-bt6h6g{margin-left:-20px;padding-right:4px;color:var(--theme-ui-colors-primary,#1B1F23);}一、hexo-generator-index修改

二、日志配置

三、置顶文案/样式设定

评论区

一、hexo-generator-index修改