主题开发：添加自定义车把助手答案

【问题标题】：Theme Development: Adding custom handle bar helpers主题开发：添加自定义车把助手
【发布时间】：2014-08-06 14:18:04
【问题描述】：

对于techno theme，我想为用户提供自定义的 hb 助手和配置。为此，我对 [ghost root]/index.js 应用了覆盖。

下面的代码在当前主题文件夹中搜索 index.js 并运行它。

var ghost = require('./core'),
    errors = require('./core/server/errorHandling');

ghost()
.then(function (param) {

    var settings = require('./core/server/api').settings;

    settings
        .read({key: 'activeTheme', context: {internal: true}})
        .then(function (result) {

            try {
                require('./content/themes/' + result.value + '/index')();
            }
            catch (e) {
                //No custom index found, or it wasn't a proper module.
            }

        });
})
.otherwise(function (err) {
    errors.logErrorAndExit(err, err.context, err.help);
});

主题级别 index.js 注入自定义博客变量（来自配置文件）和 hb 助手。

var hbs = require('express-hbs'),
    _ = require('lodash'),
    downsize = require('downsize'),
    blogVariable = require('../../../core/server/config/theme');

module.exports = function() {

    //This block allows configuration to be available in the hb templates.
    var blogConfig = blogVariable();
    var config = require('./config') || {};
    blogConfig.theme = config;
    //console.log(JSON.stringify(blogConfig));

    ////Custom hb helpers////

    hbs.registerHelper('excerpt', function (options) {

        ...

        return new hbs.handlebars.SafeString(excerpt);
    });

    ...

};

使用自定义博客变量的示例如下。

<ul class="list-inline">
    <li><a href="{{@blog.theme.author.github}}" class="btn-social btn-outline" data-toggle="tooltip" data-placement="top" title="Github"><i class="fa fa-fw fa-github"></i></a>
    </li>
...

在 Ghost 0.4.2 中有没有更好的方法来做到这一点？我不喜欢让用户覆盖 ghost core index.js 文件。

【问题讨论】：

标签： ghost-blog

【解决方案1】：

有一篇博客文章解释了如何仅通过修改config.js 文件并将文件添加到根目录来执行此操作。我同意作者的观点，这更有可能是防更新的。 http://zackehh.com/safely-creating-custom-handlebars-helpers/

添加：

require('./helpers')();

到config.js顶部

然后像这样在你的helpers.js 文件中添加助手：

var hbs = require('express-hbs');

module.exports = function(){  
    hbs.registerHelper('json', function(context) {
      return JSON.stringify(context);
    });
};

【讨论】：

接受这个答案，因为如果我将配置保留在服务器端，这是最好的解决方案。我最终将配置移动到客户端并使用 knockoutjs 在客户端注入配置。

【解决方案2】：

很遗憾，不久前论坛上有一篇关于此的帖子，但是您可以将自己的 helpers.js 文件添加到 core 文件夹中...

var hbs = require('express-hbs')

// quick function for an example
registerHelper = function(){

    hbs.registerHelper('ifNthItem', function(nthItem, currentCount, offset, options) {
        if((currentCount+ offset)%(nthItem) == 0) {
            return options.fn(this);
        } else {
            return options.inverse(this);
        }
    });
};

module.exports = registerHelper;

然后将其链接到 index.js 中

var when      = require('when'),
    bootstrap = require('./bootstrap'),
    scopa = require('./helpers');

    scopa();

至少这样你不会修改核心 index.js 而是修改 helpers.js。

【讨论】：