博客迁移

前言

这算是个大工程了,从开始决定用Hexo代替WordPress,花了差不多半个月的业余时间才基本上搞完。

搭建Hexo

这一步可以说是非常简单了,跟着官网的步骤来就行。

首先在电脑上准备好Node.js环境,任意目录执行:

1
$ npm install -g hexo-cli

这样Hexo就装好了。在任意目录执行hexo init myblog,Hexo就会创建一个叫做myblog的目录,里面的结构大概是这样:

1
2
3
4
5
6
7
8
9
10
11
12
myblog
- scaffolds
- draft.md
- page.md
- post.md
- source
- _posts
- hello-world.md
- themes
- landscape
- _config.yml
- package.json

从下到上,最外部的_config.yml是整个站点的配置文件;themes里存放的是安装的各种Hexo的主题,默认主题是landscapesource里存放的是用户文件,比如写的文章,自定义的脚本或css之类的;scaffolds类似于一种模板,每次使用hexo new新建文档的时候就会从这里找到对应的模板来创建。

我们看到已经有一篇默认的hello-world.md日志了,所以接下来什么都不用做,直接在命令行里输入:

1
2
$ hexo generate;hexo server
# 两条命令分别可以简写成 hexo g 和 hexo s

经过最多几秒钟的等待,直到可以在控制台看到INFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.,这时我们在浏览器中输入http://localhost:4000,就可以看到Hexo已经可以正常工作了:

pic1

安装和配置NexT主题

NexT是一款非常受欢迎的Hexo主题,可定制能力非常强大,于是我便选择了这个主题。

这里下载最新的release版本,解压并存放在站点的themes目录下,可以看到主题目录里也有个_config.yml,这个就是主题的配置文件了,NexT主题的配置项非常多,大家可以一条一条看,看到有意思的就可以修改下配置然后重新hexo g;hexo s观察下效果,经过配置总能弄出来自己独一无二的主题啦~

NexT主题内置了丰富的第三方服务,比如评论,统计,搜索,页面背景等等。如果遇到不好用的第三方服务或者插件,这些脚本基本上都是开源的,也就是说可以自己手动修改源码来实现自己想要的效果。

这些配置项在配置文件里大多都附有详细的解释和相关的网址,如果不知道是干嘛用的就可以点开对应的介绍地址,你就会发现原来还有这么多好玩儿的东西默认是没有启用的,比如说:

  1. 网站的favicon生成
  2. CC版权声明
  3. 字数统计
  4. 相关阅读
  5. 数学公式
  6. PDF支持
  7. 更好的汉字排版

其中有两个需要额外配置的功能,分别是leancloud_visitors用于统计文章阅读量,以及valine用于提供文章评论功能。Hexo作为一个静态博客,本身是不能支持这种动态数据的,所以这时我们就需要把这些数据存在另外的地方:LeanCloud,这是一个提供免费的数据存储的平台,我们就把访问量和评论放在这里。

关于Valine的配置,可以看这里

关于访问量,配置完Valine后在LeanCloud的后台创建一个叫做Counter的类,这个类用于保存访问量信息。这里我没有用Valine自带的访问量统计功能,而是用了一个更安全的方案。

至于其他的各种各样的配置和魔改,我也是参考了许多网上的文章,修改了不少主题的样式代码,最终算是实现了我想要的功能和效果。

处理Http和Https之间的关系

因为之前的WordPress是HTTP协议的,所以http://inspoy.cchttps://inspoy.cc指向的不是同一个网站,所以我需要经过一些配置,使所有可能访问到之前博客的请求全部重定向到新的https地址,而不是访问WordPress博客的http请求则保持不变。

HTTP站点的根目录新建.htaccess文件,配置跳转规则:

1
2
3
4
RewriteEngine on # 启用重写
RewriteCond %{SERVER_PORT} !^443$ # 不是443端口的才处理
RewriteRule ^/?$ https://inspoy.cc/ # http主页会跳转至 https://inspoy.cc/
RewriteRule ^?wordpress/.* https://inspoy.cc/blog/ # 其余请求地址以wordpress开头的全部跳转至 https://inspoy.cc/blog/

这样之前的WordPress博客的所有页面就不能再访问了。

但是这样有个问题,用户通过之前的固定链接点进去发现跳转到了博客的首页,看不到想看的文章,体验就很差了。所以还得指定一个规则,某些特定的url要跳转到另一个特定的url。还是在刚才的.htaccess里面追加配置,把之前所有的博客的旧地址已经对应的新地址全列举出来,全部配完是这样子:

pic2

然后大功告成!

总结

新的博客终于能正常使用了,如果之后有空的话就把评论系统改进一下,加上表情,邮件提醒以及垃圾评论过滤的功能。

折腾了差不多半个月,我要继续做游戏去了~