Part two on how I built my blog

March 22, 2012 . Coding . Comments
Tags: jekyll github rss

Tweet

Preface

This is a follow up from my last post How I built my blog in one day. There were several items I left out and several more that I have refined. This blog still only begins to scratch the surface on what someone can do with Jekyll and bootstraping other technologies, so please comment and share your ideas.

Download source

Jekyll

Post Configuration

Jekyll provides various configuration attributes that you can specify on your post to use those value/pairs later with referring back to a post or iterating through your posts (aka YAML Front-Matter). I have added several new post properties: year, date, day, tags, published, summary. For more information about what each property is and how it works view the Jekyll documentation.

Tag Pages

You will need to create two new files:

tag_gen.rb - Create this in the _plugins folder
tag_index.html - Create this in the _layouts folder

tag_gen.rb is a Jekyll module that will create the static web pages that will list the posts affiliated with the tag.

tag_index.html is a Jekyll layout that will display the posts on the tag page.

Generate the tag pages - The Jekyll module tag_gen.rb will generate a "tags" folder in the "_site" directory. The module will also generate subfolders for each tag listed on the posts. If you add new tags you'll have to build again or stop and start your Jekyll server. For GitHub user pages you will want to copy the "tags" folder from the "_site" folder into the root folder inline with "_site". See my GitHub user page repo layout to understand more.

Tag Lists

List all tags within your site.

List all tags for a post.

jekyll github rss

Disqus

Issues fixed

On my previous post I hadn't quite worked out all the bugs and I guess a developer never truely does. However, the comment counts on the home page and the post never populated and I have figured out why.

In the script configuration I had forgotten to add the disqus_identifier and disqus_url.
In the link I had forgotten to include the data-disqus-identifier and set it to the page url.

RSS Feed

Initially when using a GitHub user page I thought that I could use https://github.com/erjjones.atom to hook up my RSS feed on feed burner, but I had a hard time getting Feed Burner to register it. I noticed on Zach Holman's user page he had a atom.xml file and after further review you see that it is configured to register exactly what I needed to setup the RSS feed. Save this file to the root directory of your site and then you can register something like http://erjjones.github.com/atom.xml to feed burner and now you have an RSS feed for your blog.

README (.md)

Save your README file to README.md.

Other Tips

Google Analytics - Hook up Google Analytics you'll be amazed.
Favicon - Found a quick and easy site to generate a favicon.ico.
Flattr - Flattr is Social Micro Payments, it is a way to support stuff you like on the web.
Hacker News Link - If you submit your article to Hacker News put a link on your post to the article on Hacker News.

In Conclusion

Again, I hope this sparks you to try out GitHub, Jekyll, Twitter Bootstrap and other open source web resources. I have just begun to scratch the surface here and this blog doesn't attempt to cover all of details but I would like to hear what other cool integrations people are doing on their blogs.

Comments Section

Feel free to comment on the post but keep it clean and on topic.