博客构建笔记(更新:增加排序功能)

前言

    记录总结学习过程的重要性不言自明。博客正好就是这一过程的体现平台,所以构建并完善这个平台就显得尤为重要了。由于周期性的懒癌发作,所以可惜的是构建此博客的前期并未记录下来,这两天因为开始写年终总结了,所以连续为博客增加了两项功能,至此我认为应该记录一下。

功能

订阅

    一直都知道很多博客有订阅 rss 的功能,但是从来没有使用过,所以前期构建的时候并没有将这个功能作为博客的核心功能。直到邮件订阅了一些网站之后,只要有更新就会自动推送邮件,并且在邮件中就能看到更新的内容。这才感受到这个功能的便捷性,然后决定我也要给我的博客增加这个功能。
    经过一番探索,经过以下步骤可以实现 rss 及邮件订阅的功能:

  1. 利用 npm 下载安装 hexo-generator-feed 插件,命令如下:
    $ npm install --save hexo-generator-feed
  2. 在主题配置文件 _config.yml 中增加以下内容:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    #Feed configuration
    plugin:
    - hexo-generator-feed

    feed:
    type: atom // Feed type. (atom/rss2)
    path: atom.xml // Feed path. (Default: atom.xml/rss2.xml)
    limit: 20 // Maximum number of posts in the feed.
    hub: // URL of the PubSubHubbub hubs (Leave it empty if you don't use it)
    content: true // (optional) set to 'true' to include the contents of the entire post in the feed.
  3. 在主题配置文件 _config.yml 中设置 rss 项:
    rss: "/atom.xml"

  4. 至此,更新部署博客就能看到有 rss 订阅功能了,需要邮件订阅功能则需要从下面一步开始;
  5. 利用 feedbuner 来制作一个feed(如果没有账号可以注册一个或者用谷歌账号登录):
    第一张图
  6. 在上图中填入你的博客订阅地址,如下所示:
    第二张图
  7. 之后直接点击 next 就成功制作了一个feed:
    第三张图
  8. 制作完之后在种子信息面板开启邮件订阅的功能:
    第四张图
  9. 至此,你已经得到了两种形式的代码了,根据自己的需要使用到自己的网站上,我使用的是超链接的形式。

置顶

    这也是一个一直想要的功能,因为很有可能有些博客的重要性比其他的更高,但是由于默认按照时间来排序导致翻页之后才能看到这些文章。正好这两天在捣鼓博客,索性将这个功能也做出来。最开始的时候准备将博客的源码文件捋清楚后自己修改代码,但是打开hexo文件夹一看,打了个哆嗦就把文件夹关了:我是不是傻,为啥不先去搜索一番?
    果然,一搜就发现有很多人多有这个需求: 如何置顶post?。整个帖子看下来的结论是:各种尝试的结果都或多或少有bug,所以此暂时暂时搁置,日后再来开发。不过里面倒是有个链接指出了通用配置方法,这也是目前我所采用的方法。
    原文写的比较详细,我也就不再多费口舌了,总的来说就是更改排序规则,并将新的变量(top)增加到post的开头部分。经测试,效果不错。


加密

    对于某些涉及隐私,或者只希望分享给有限人群的博客,加密功能就非常实用了。之前一直没有将这个功能加上来,因为需求没这么迫切。最近准备开始投简历,里面会涉及一些个人信息,但是又希望公司能够通过博客的形式看到简历,这个功能就必不可少了。通过搜索,找到这个一个帖子,基本能满足需求:

    加密博客内容,使用密码访问

    仔细看了一下这篇博客及对应项目的 GitHub 文档,满足基本需求不成问题,但是有两点不足:第一,官方文档写的不是太好,有些地方不好理解;第二,对于基于 GitHub page 的博客基本无效。然后在 GitHub 上顺藤摸瓜,找出了下面这个项目:

    hexo-blog-encrypt

    文档清晰易懂,开发者响应迅速,最重要的是能够完整加密。如果非要提不足的地方,那就是解密后目录栏不会自动更新。和开发者沟通过,这个需要根据不同的 Hexo 主题进行对应的更改,经过一番尝试后测试失败。由于时间问题,暂时我就不去管它了。
    所以,如果你也需要为博客设置密码,推荐第二种方式。
    非常感谢两位开发者做出的探索。


迁移

换电脑后写博客没有以前那么方便了,加上懒癌晚期,一直拖着没有把以前电脑上的资源迁移过来,所以大半年都没有写博客了。昨天晚上不知道哪根筋搭错了,终于决定将很久都没有做的事情完成下。
看了几篇博客,有些挺难理解的,一步一步尝试做下来总会失败。可能是没有理解其中缘由,也可能是时过境迁,以前的方法不再适用。最终成功的方法来自知乎用户@[skycrown](https://www.zhihu.com/people/skycrown):[使用hexo,如果换了电脑怎么更新博客?](https://www.zhihu.com/question/21193762)

不知道题主是不是换了新电脑,需要在新电脑上进行部署,如果是,可以参考下面的方法:
1、从官网Git**下载git,在新电脑上安装,因为https速度慢,而且每次都要输入口令,常用的是使用ssh。使用下面方法创建:
(1)打开git bash,在用户主目录下运行:ssh-keygen -t rsa -C “youremail@example.com“ 把其中的邮件地址换成自己的邮件地址,然后一路回车
(2)最后完成后,会在用户主目录下生成.ssh目录,里面有id_rsa和id_rsa.pub两个文件,这两个就是SSH key密钥对,id_rsa是私钥,千万不能泄露出去,id_rsa.pub是公钥,可以放心地告诉任何人。
(3)登陆GitHub,打开「Settings」->「SSH and GPG keys」,然后点击「new SSH key」,填上任意Title,在Key文本框里粘贴公钥id_rsa.pub文件的内容(千万不要粘贴成私钥了!),最后点击「Add SSH Key」,你就应该看到已经添加的Key。
注意:不要在git版本库中运行ssh,然后又将它提交,这样就把密码泄露出去了。
2、下载Node.js**,并安装
3、打开git bash客户端,输入 npm install hexo-cli -g,开始安装hexo
4、下面就将原来的文件拷贝到新电脑中,但是要注意哪些文件是必须的,哪些文件是可以删除的。
(1)讨论下哪些文件是必须拷贝的:首先是之前自己修改的文件,像站点配置_config.yml,theme文件夹里面的主题,以及source里面自己写的博客文件,这些肯定要拷贝的。除此之外,还有三个文件需要有,就是scaffolds文件夹(文章的模板)、package.json(说明使用哪些包)和.gitignore(限定在提交的时候哪些文件可以忽略)。其实,这三个文件不是我们修改的,所以即使丢失了,也没有关系,我们可以建立一个新的文件夹,然后在里面执行hexo init,就会生成这三个文件,我们只需要将它们拷贝过来使用即可。总结:_config.yml,theme/,source/,scaffolds/,package.json,.gitignore,是需要拷贝的。
(2)再讨论下哪些文件是不必拷贝的,或者说可以删除的:首先是.git文件,无论是在站点根目录下,还是主题目录下的.git文件,都可以删掉。然后是文件夹node_modules(在用npm install会重新生成),public(这个在用hexo g时会重新生成),.deploy_git文件夹(在使用hexo d时也会重新生成),db.json文件。其实上面这些文件也就是.gitignore文件里面记载的可以忽略的内容。总结:.git/,node_modules/,public/,.deploy_git/,db.json文件需要删除。
5、在git bash中切换目录到新拷贝的文件夹里,使用 npm install 命令,进行模块安装。很明显我们这里没用hexo init初始化,因为有的文件我们已经拷贝生成过来了,所以不必用hexo init去整体初始化,如果不慎在此时用了hexo init,则站点的配置文件_config.yml里面内容会被清空使用默认值,所以这一步一定要慎重,不要用hexo init。
6、安装其他的一些必要组件,如果在node_modules里面有的,就不要重复安装了:
(1)为了使用hexo d来部署到git上,需要安装
npm install hexo-deployer-git –save
(2)为了建立RSS订阅,需要安装
npm install hexo-generator-feed –save
(3)为了建立站点地图,需要安装
npm install hexo-generator-sitemap –save
插件安装后,有的需要对配置文件_config.yml进行配置,具体怎么配置,可以参考上面插件在github主页上的具体说明
7、使用hexo g,然后使用hexo d进行部署,如果都没有出错,就转移成功了!


排序

之前已经写过了置顶的功能,逻辑是如果 post 中有 top 字段,那么先比较 top 字段值的大小,然后根据发布时间来进行排序。但是有些文章是在不断修改的,所以我认为按照修改时间来排序是一种更好的策略。对于从来不修改的文章而言,发布时间和更新时间一致,所以都可以满足。
因为 Next 默认主题是不显示修改时间的,所以如果需要按照修改时间排序,首先得显示修改时间,这个需求可以在这个问题下找到答案:[如何将首页和归档页的博文按照更新时间排序?](https://github.com/iissnan/hexo-theme-next/issues/1895) 在将修改时间添加到配置文件之后,每篇博客开始的时候就需要将 updated 字段加进去,这块有个坑:**date 和 updated 的值不能一样,否则不会显示。**
修改的策略其实和置顶一致,只需要把 `node_modules/hexo-generator-index/lib/generator.js` 中以下部分的 date 改成 update 就行:
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
26
27
28
'use strict';
var pagination = require('hexo-pagination');
module.exports = function(locals){
var config = this.config;
var posts = locals.posts;
posts.data = posts.data.sort(function(a, b) {
if(a.top && b.top) { // 两篇文章top都有定义
if(a.top == b.top) return b.date - a.date; // 若top值一样则按照文章日期降序排
else return b.top - a.top; // 否则按照top值降序排
}
else if(a.top && !b.top) { // 以下是只有一篇文章top有定义,那么将有top的排在前面(这里用异或操作居然不行233)
return -1;
}
else if(!a.top && b.top) {
return 1;
}
else return b.date - a.date; // 都没定义按照文章日期降序排
});
var paginationDir = config.pagination_dir || 'page';
return pagination('', posts, {
perPage: config.index_generator.per_page,
layout: ['index', 'archive'],
format: paginationDir + '/%d/',
data: {
__index: true
}
});
};

上述代码引用自: 解决Hexo置顶问题


打赏

版权

图床

最近又收到七牛云的邮件了,说是之前的测试域名马上就要到期了,到期后会收回。为了避免到时候所有的图片都看不到,开始准备把图片迁移,有两种方案,其一:绑定自己的域名;其二,找其他图床。本来想着绑定就绑定吧,也没啥影响,然后发现绑定之前必须要备案才行,也就是说你所有的实名信息都需要提交到工信部,这我就不开心了。虽说也不准备做什么违法乱纪的事情,但总是不想处于这种监管的状态的。所以开始找第二种方案。然后发现了 sm.ms 图床,有很好的 api 支持,找到一篇文章有相关记录,里面很详细的记录了整个配置的过程:SM.MS: 一名优秀的图床的艺术之旅。

赠人玫瑰,手有余香