Hexo NexT主题 更强的自定义页面

Hexo NexT美化

---

​ Hexo NexT主题博客默认只有一个主页面，虽然可以在config.yml中选择以哪个板块作为主页面，但假如我想有多个不同的页面都与主页一样有页面预览，还是难以直接做到的。网上确实有一篇教程：【Hexo添加自定义分类菜单项并定制页面布局(简洁版)】，我的snippet板块第一版就是用这个教程搭建的，但之后发现存在一些问题。那么应该如何解决呢？

---

Snippet板块与主板块关系

​ Snippet板块下的所有post，其分类（category）都是"snippet"，根据上文博客提到的代码：

var realestatePosts = locals.posts.filter(function(x) {
  return x.categories.data[0].name == filteredCategory;
});

​ 这样可以筛选分类为"filteredCategory"的博文，只显示在Snippet板块。但是主板块上仍然无法阻止分类为"filteredCategory"的博客显示（主板块上不显示最合理），开始时我尝试修改.njk文件，但分页会出现错误。我在hexo-next开了个issue，点击下述图片以查看。解决方案是把hexo-generator-index替换为hexo-generator-indexed。

---

强化

​ 【Hexo添加自定义分类菜单项并定制页面布局(简洁版)】开了一个很好的头，通过这种方法确实可以生成一个新的板块，其中只留有特定分类的博文，但是多post一些博文会发现致命问题：

• 博文排序是倒序的，越老的post排在越前面。阿哲，历史文件的现实意义？
• 博文置顶失效了。在hexo-generator-indexed中有个这样的功能：只需要在markdown的front-matter中填上:sticky: x（x是优先级，最小0最大100），就会根据优先级来排序，可以实现置顶功能，但是在博客的方法下失效了。我们看看博客中提到的方法代码：

const pagination = require('hexo-pagination');
const filteredCategory = 'snippet';

hexo.extend.generator.register('custom', function(locals){
  var realestatePosts = locals.posts.filter(function(x) {
    return x.categories.data[0].name == filteredCategory;
  });
  return pagination('snippets', realestatePosts, {
    perPage: 10,
    layout: ['index'],
  });
});

​ 非常plain，就是过滤了一下标签。在这里，我按照hexo-generator-indexed中的代码（在hexo的node_module下可以看到），借鉴其generator.js修改了这个博客过滤：

const pagination = require('hexo-pagination');
const { sort } = require('timsort');
const filteredCategory = 'snippet';

hexo.extend.generator.register('custom', function(locals){
  var posts = locals.posts.filter(function(x) {
    return x.categories.data[0].name == filteredCategory;
  }).sort('-date').slice(0);				// 复制，而非原地操作
  sort(posts.data, (a, b) => (b.sticky || 0) - (a.sticky || 0));
  return pagination('snippets', posts, {
    perPage: 10,
    layout: ['custom'],
    data: {
      __index: true
    }
  });
});

​ 过滤之后立马调用timesort，根据日期排序，再根据posts中博客的sticky值排序，两处都定义了匿名函数。这样一来，博客生成的就是正确的排版。