Wintersmith

Today, I moved to the wintersmith from the wordpress. Wordpress is amazing blog platform. However, I want to try a static generated blog instead of dyanmic. Actually there is no reason for changing to static page. After testing wintersmith , it is really fast. It is easy to use.

Pros : support markdown. Static pages. Really fast. Can use with github pages.

Cons : no full text search and use with google custom search. Need to use jade for creating template. Only few templates. You need computer to write blog.

I prefer wintersmith than jekyll because of node.js. I can customize if it’s require to change.

Worpdress to Wintersmith

I am using wp-to-wintersmith to import posts from wordpress.

Sitemap xml

To create sitemap , first create sitemap.jade in template folder.

In sitemap.jade , put following code

doctype xml
urlset(
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance",
  xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd",
  xmlns="http://www.sitemaps.org/schemas/sitemap/0.9")
  - var buildDate = new Date().toISOString()
  url
    loc= locals.url
    lastmod= buildDate
    changefreq daily
    priority 1.0
  url
    loc= locals.url + "/archive.html"
    lastmod= buildDate
    changefreq daily
    priority 1.0
  - var articles = _.chain(contents.articles._.directories).map(function(item) {
  -   return item.index
  - }).compact().filter(function(article) {
  -   return article.metadata.ignored !== true
  - }).sortBy(function(item) {
  -   return -item.date
  - }).value()
  for article in articles
    - var permalink = locals.url + article.url
    url
      loc= permalink
      lastmod= article.date.toISOString()
      changefreq daily
      priority 0.8

  - var tags = _.chain(contents.articles._.directories).map(function(item) {
  -   return item.index
  - }).compact().filter(function(article) {
  -   return article.metadata.ignored !== true
  - }).map(function(article) {
  -   return article.metadata.tags
  - }).flatten().compact().uniq().value()

  for tag in tags
    - var permalink = locals.url + "/tag/" + tag
    url
      loc= permalink
      lastmod= buildDate
      changefreq daily
      priority 0.8

  - var categories = _.chain(contents.articles._.directories).map(function(item) {
  -   return item.index
  - }).compact().filter(function(article) {
  -   return article.metadata.ignored !== true
  - }).map(function(article) {
  -   return article.metadata.categories
  - }).flatten().compact().uniq().value()

  for category in categories
    - var permalink = locals.url + "/category/" + category
    url
      loc= permalink
      lastmod= buildDate
      changefreq daily
      priority 0.8

  - var archives = _.chain(contents.articles._.directories).map(function(item) {
  -   return item.index
  - }).compact().filter(function(article) {
  -   return article.metadata.ignored !== true
  - }).map(function(article) {
  -   return article.date.getFullYear()
  - }).flatten().compact().uniq().value()

  for archive in archives
    - var permalink = locals.url + "/archive/" + archive
    url
      loc= permalink
      lastmod= buildDate
      changefreq daily
      priority 0.8

This code is from blog.bazoud.com.

After that , create sitemap.json under the content folder.

sitemap.json is like following

{
    "template" : "sitemap.jade",
    "filename" : "sitemap.xml"
}

After that , you can call http://www.yoururl.com/sitemap.xml for google sitemap.

Add tags

To add tag , you need to use the wintersmit-tag.

With npm ,

npm install wintersmith-tag

after that add wintersmith-tag in config.json

{
  "plugins": [
    "wintersmith-tag"
  ]
}

You also need to update the plugin setting in config.json

{
    "tag": {
        "template": "tag-index.jade",
        "perPage": 4
    }
}

Also need to edit the paginator.coffee plugin.

paginatorDefaults =
    template: 'index.jade' # template that renders pages
    articles: 'articles' # directory containing contents to paginate
    first: 'index.html' # filename/url for first page
    filename: 'page/%d/index.html' # filename for rest of pages
    perPage: 2 # number of articles per page

tagDefaults = 
    filename: 'tag/%s/%d/index.html' # => tag/:tagName/:pageNum/index.html

options = _.extend {}, paginatorDefaults, env.config.paginator, tagDefaults, env.config.tag

After that , you can add tags in articles.

---
title: Hello world
date: 2012-10-14 8:31
template: article.jade
tags: Algorithm, a happy story
---

It almost done. However , you need to update the template. So, duplicate index.jade and change the new filename to tag-index.jade in templates folder.

In *article.jade , you can add tags list like following

- var tags = env.helpers.getTagsFromArticle(page)
  ul.tags
    each tag in tags
      li
        a.big-tag(href=env.helpers.getTagHome(tag).url)= tag

For comment

You can use disqus for comment system. Convert disqus javascript to jade template code and put in the articles.jade