Custom Wintersmith Helper

Today , I was trying to add twitter card in my blog. It have a problem for twitter card description. Wintersmith didn’t support plain text for blog post. Blog intro already using the HTML code. So, I need to remove.

So, I create the custom helper like following.

Create a wintersmith-custom-helper folder under node_modules

In the wintersmith-custom-helper , it have 2 file. index.js and package.json .

In the package.json

{
  "name": "wintersmith-customhelper",
  "version": "1.0.0",
  "description": "Custom Helper For My Blog",
  "author": "saturngod",
  "license": "MIT",
  "keywords": [
    "wintersmith",
    "wintersmith-custom-helper"
  ],
  "main": "index.js",
  "dependencies": {
  },
  "devDependencies": {
    "vows": "0.7.x",
    "wintersmith": "2.x"
  },
  "peerDependencies": {
    "wintersmith": "2.x"
  }
}

I gave the module name is wintersmith-customhelper.

In the index.html

module.exports = function(env, callback) {
  env.helpers.getDescription = function(htmlcode) {
    var code;
    code = htmlcode.replace(/(<([^>]+)>)/g, "");
    code = code.substring(0, 255);
    code = code.replace("\n", " ");
    code = code.replace("\"", "");
    return code = code + " ... ";
  };
  return callback();
};

I create the getDescription helper for description.

After finish that, need to update the config.json

In the config.json , we need to put the plugin. So, it will be like

"plugins": [
    "wintersmith-tag",
    "./node_modules/wintersmith-custom-helper"
  ],

Done. So, we can call env.helpers.getDescription in our template.

- var plain = env.helpers.getDescription(page.intro)
meta(name='twitter:description', content="#{plain}")

It easy to create helper and you can also use .coffce instead of .js file for plugin.

comments powered byDisqus