Jekyll: Pagination, Archives, and Excerpts

I recently converted this blog to jekyll — I figured since I had to move my slicehost slices elsewhere anyway, I might as well ditch wordpress and play with something new. It's been a bit of adventure getting the site rendered by jekyll to match the URL structure I had in place with wordpress, so I thought I'd share some of the code I found and wrote to make it work.

The first step was pagination. My old page links were in the form of /page/2, rather than page2 like jekyll's default. This was an easy fix, based on some comments in the Google group. I just copied the pagination.rb from the jekyll gem into my _plugins directory and changed line 32 as follows: newpage.dir = File.join(page.dir, "page#{num_page}") to newpage.dir = File.join(page.dir, "page/#{num_page}")

One thing I didn't see in many of the blog posts I found about converting from wordpress to jekyll was detailed information on generating archive pages. Those are the pages in the form (for my layout) of /year/month, where you'd see all the posts written in that month. Using the category plugin from Recursive Design as a starting point, I added year and month output, with pagination, with this archive generator plugin. I used a similar block of pagination code (which is just lifted from jekyll's pagination code) as a modification to Recursive Design's category plugin to get pagination for my category pages, too.

Finally, I wanted excerpts, or "read more", like you are seeing in this blog post, and I didn't find any existing plugins that did it, so I wrote one. My excerpt plugin for jekyll creates an excerpt with the content of the post it finds before the --more-- comment tag, if there is one. In my index views, I assign excerpt = true to get _includes/post.html to render the excerpt view rather than the full content. On the full post view, post.html renders the full content, with the --more-- comment tag replaced with a #more anchor that can be used as a link target to continue reading where the excerpt left off.

After all that, and after a few other nips and tucks, my new site looks almost exactly like my old site. :)

Comments