我使用的Ghost博客一直使用者默认的Casper主题。我向来没怎么打理过自己博客，一方面认为自己不够专业，很难写出质量比较高的文字；另一方面认为博客太耗时间，很容易影响正常的工作内容。最近公司即将搬迁，我的开发工作也告一段落，因此抽点时间自定义一个自己的博客主页。
备注：上图来自GhostChina官网，与本文内容无关。
Ghost与Ghost主题
Ghost自称是专业的内容发布平台，实际上跟WordPress相比它只能算一个相对比较年轻的博客系统，在功能上完全无法与成熟的WordPress相比。
我之所以选择Ghost作为博客系统除了它简单方便，更因为它是基于Node.js且开源。毕竟基本的功能有了，如果有其他需求的话自己改代码就可以实现。Ghost提供HTTP服务用的是Express框架。这是一种对我这类半路接触js的人都可以轻易掌握的框架。
Ghost主题存放在安装路径的content/themes目录中。安装包自带了Casper和Roon两个主题，其中前者为默认主题。
Ghost支持HandleBars模板语言，自带的两个主题也是基于此语言编写的，因此，定制Ghost主题最简单的方法是复制一份Casper的代码，基于它进行自定义。我就是这么做的。
关于自定义主题的详细介绍不在这里展开，若有需要请参考该链接：http://docs.ghostchina.com/zh/themes/。
自定义主页
Ghost只定义了几个主要页面，分别是文章列表页（包含主页）、文章内容页、某标签的文章列表、某作者的文章列表，以及一些rss或sitemap相关的页面。
这么一说你就发现了，博客的主页和文章列表页面是同一个页面。主页对应的路径为/，列表对应的路径为/page/:page，其中:page为占位符，表示某个页码值，如1、2、3等。这两个路径实际上渲染的都是同一个模板文件index.hbs。默认地，Ghost接收到请求时/page/1的GET请求时，返回301重定向到/，再结合一些样式变化，从而让你以为主页和列表页是分离开的。
我要做的就是让主页和列表页面不一样。
解决方法1
首先我想到的就是在index.hbs文件中通过变量渲染不一样的内容。参考pagination.hbs我发现确实存在这两个可用的变量：prev表示是否有前一页，以及page表示当前为第几页。
如果能拿到这两个变量中的一个，我就可以区别对待主页和列表。遗憾的是不行。
分页相关的变量是模板驱动的，也就是说只能在固定的pagination.hbs这个文件中才能获取对应的值。该结论尚未在代码上得到验证
若在这个问题继续下去是可以实现我的需求的，但考虑到偏离Ghost原来的设计太远可能埋下更多坑，因此放弃该解决方法。
解决方法2
既然无法在模板上解决问题，那就让路径/渲染原来的index.hbs，让路径/page/:page渲染另一个HandleBars文件（我设定为list）。
实现这个方法只要两个步骤：
- 去除针对
/page/1的重定向； - 为
/page/:page指定新的渲染文件list.hbs。
需要改动ghost安装目录下的core/server/routes/frontend.js文件。下面是改动后的结果：
其中，handleIndexPageParam是参考handlePageParam后新增加的一个函数，内容如下：
function handleIndexPageParam(req, res, next, page) {
var rssRegex = new RegExp('/rss/(.*)?/');
page = parseInt(page, 10);
if (page === 1 && rssRegex.test(req.url)) {
// Page 1 is an alias, do a permanent 301 redirect
return redirect301(res, req.originalUrl.replace(rssRegex, '/rss/'));
} else if (page < 1 || isNaN(page)) {
// Nothing less than 1 is a valid page number, go straight to a 404
return next(new errors.NotFoundError());
} else {
// Set req.params.page to the already parsed number, and continue
req.params.page = page;
return next();
}
}
另外/page/:page路径对应的渲染对象frontend.list在core/server/controllers/frontend/index.js中定义。改后的内容如下图所示：
描述list节点的配置在core/server/controllers/frontend/channel-config.js中定义，在defaults中增加一个节点：
... list: { name: 'list', route: '/', frontPageTemplate: 'home' }, ...
尽管需求实现了，但是这种解决方法产生了新的问题：以后无法直接使用第三方提供的主题，若要使用，需要复制index.hbs到新的文件list.hbs。
解决方法3
实际上方法2的解决方案增加list相关的代码是多余的，我在Ghost官网的文档里面查到，原来可以让路径/独立渲染home.hbs文档，而路径/page/2+依旧渲染index.hbs。
因此结合方法2，应该可以有一种更轻巧的自定义主页的方式。