Aug 22, 2014 - Jekyll Clean Theme

Welcome to the sample post for the Jekyll Clean theme.

A simple and clean Jekyll theme using bootstrap (not to be confused with jekyll-bootstrap) that’s easy to modify and very modular in component and element reuse.

It uses Disqus for comments and includes Google Analytics support. Both of these features are disabled by default and can be enabled via _config.yml. You can also rip this code out of the templates if you like (footer.html and post.html). The beauty of Jekyll - keep things clean… Jekyll Clean!

The theme works well on mobile phones, using a collapsable nav bar and hiding the sidebar. The links pane in the sidebar is available on mobile through the nav menu, and you can do the same thing for any other sections added to the sidebar.

Don’t forget to occassionally merge against my upstream repository so you can get the latest changes. Pull requests are encouraged and accepted!

Installation

If you don’t have a blog already on github, start by cloning this repository. Best to do that directly on github and then clone that down to your computer.

If you already do have a blog, You can certainly apply this theme to your existing blog in place, but then you won’t be able to merge as the theme changes. If you re-apply your blog history on top of this theme’s gh-pages branch, it’s then easy to update to the latest version of the theme. You also don’t want to have to deal with resolving old conflicts from your existing history, so you may wish to to push your existing master off to a new branch so you have the old history and start a new branch with this as the start, merging in your _posts and other assets (after git rm’ing the current _posts.

Not ideal, but you have to make a choice - either apply it manually or base your blog off this theme’s branch. Either way it will work, and both have their own pros and cons.

You can setup an upstream tracking repository like so:

$ git remote add upstream git@github.com:scotte/jekyll-clean.git

And now when you wish to merge your own branch onto the latest version of the theme, simply do:

$ git fetch upstream
$ git merge upstream/gh-pages

Of course you will have to resolve conflicts for _config.yml, _includes/links-list.html, and _posts, and so on, but in practice this is pretty simple.

This is how I maintain my own blog which is based on this theme. The old history is sitting in an old-master branch that I can refer to when I need to.

Running Locally

Here’s the exact set of packages I need to install on Debian to run jekyll locally with this theme for testing.

$ sudo aptitude install ruby ruby-dev rubygems nodejs
$ sudo gem install jekyll jekyll-paginate

And then it’s just a simple matter of running jekyll locally:

$ jekyll serve --baseurl=''

Now browse to http://127.0.0.1:4000

Using gh-pages

Running a jekyll site is a bit outside the scope of this doc, but sometimes it can be a bit confusing how to configure jekyll for project pages versus user pages, for example.

To start with, read through the documentation here. This will provide a good overview on how it all works. The git branch and baseurl (in _config.yml) will change depending on the sort of site deployed.

When you clone this repository, it’s set up for project pages, so the deployed branch is “gh-pages” and baseurl is configured to ‘jekyll-clean’, because that’s the name of this project.

If you plan to deploy this as user pages, the deployed branch is “master” and baseurl is configured to ‘’ (i.e. empty).

Comment Systems

Jekyll clean supports both isso and disqus comment systems.

After enabling comments, either isso or disquss must be configured. Don’t try configuring both!

Isso Comments

Isso requires running a local server, so is not suitable for hosting in github pages, for example. Isso is open source and keeps all your data local, unlike Disqus (who knows exactly what they are doing with your data).

In _config.yml you’ll need to set isso to the fully-qualified URL if your isso server (this is the value for data-isso passed to the isso JS). Make sure comments is true.

Disqus Comments

Getting Disqus to work can be a bit more work than it seems like it should be. Make sure your Disqus account is correctly configured with the right domain of your blog and you know your Disqus shortname.

In _config.yml you’ll need to set disqus to your Disqus shortname and make sure comments is true.

Finally, in posts, make sure you have comments: true in the YAML front matter.

More information on using Disqus with Jekyll is documented here.

Code Syntax Highlighting

To use code syntax highlighting, use the following syntax:

```python
import random

# Roll the die
roll = random.randint(1, 20)
print('You rolled a %d.' % roll)
``` #REMOVE

(Remove #REMOVE from the end of the last line). Which will look like this in the rendered jekyll output using the default css/syntax.css provided with this theme (which is the colorful theme from https://github.com/iwootten/jekyll-syntax):

import random

# Roll the die
roll = random.randint(1, 20)
print('You rolled a %d.' % roll)

You can, of course, use any theme you wish, see the jekyll and pygments documentation for more details.

License

The content of this theme is distributed and licensed under a License Badge Creative Commons Attribution 4.0 License

This license lets others distribute, remix, tweak, and build upon your work,
even commercially, as long as they credit you for the original creation. This
is the most accommodating of licenses offered. Recommended for maximum
dissemination and use of licensed materials.

In other words: you can do anything you want with this theme on any site, just please provide a link to the original theme on github so I get credit for the original design. Beyond that, have at it!

This theme includes the following files which are the properties of their respective owners:

Jul 22, 2014 - Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed quam metus, commodo sit amet ante a, finibus efficitur lorem. Maecenas egestas purus in tempor volutpat. Sed dapibus tortor nec sem suscipit ullamcorper. Nulla nec lorem lacus. Phasellus condimentum massa quis dolor consequat viverra ut ac magna. Ut a consequat nisi. Vivamus at leo ut turpis convallis lacinia. Curabitur eu placerat quam. Donec ultricies faucibus dui, a tincidunt lorem lobortis condimentum.

Quisque aliquet consectetur justo sit amet convallis. Nunc vel aliquet ipsum, sit amet elementum justo. Vivamus id magna mi. Cras luctus est vel ipsum sagittis pellentesque. Vivamus ante elit, porttitor vitae quam quis, fermentum malesuada risus. Integer nec lectus vel lacus cursus tristique in euismod ipsum. Duis ut varius enim. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Morbi et elit eu tortor lacinia sollicitudin non in lacus.

Integer at viverra turpis. Duis aliquam mattis sapien tempor eleifend. Mauris nec eleifend risus, quis mollis neque. Vivamus non dapibus justo, vel ornare magna. Nunc in nulla venenatis, imperdiet diam in, accumsan massa. Etiam congue augue ipsum, sit amet rutrum nisi blandit quis. Cras in lectus non lorem auctor consequat a vel sem. Aliquam erat volutpat. Fusce lobortis vel orci vitae ullamcorper. Phasellus id eleifend eros. Mauris vulputate, nisi vel auctor auctor, quam enim tincidunt felis, vitae fermentum odio tortor eget est. Integer ornare blandit lectus a accumsan.

Jun 22, 2014 - Maecenas feugiat fringilla nibh

Maecenas feugiat fringilla nibh ut mattis. Sed non metus sit amet mi luctus feugiat in quis sem. Vivamus pulvinar commodo bibendum. Interdum et malesuada fames ac ante ipsum primis in faucibus. Maecenas sapien nulla, eleifend in dolor et, rutrum maximus velit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tempus malesuada egestas. Phasellus pulvinar vulputate urna in tempor. In vel sapien ullamcorper, condimentum ipsum ut, porttitor turpis. Nam auctor erat sed lectus tempus euismod. Nunc ipsum quam, condimentum ac bibendum sit amet, sodales nec metus.

Vivamus a ullamcorper ipsum. Donec dictum eleifend massa, rhoncus consequat sem tempor nec. Ut bibendum luctus gravida. Nullam eleifend laoreet quam, nec tincidunt dolor tincidunt non. Aenean vel magna massa. Pellentesque sit amet tincidunt ante. Nulla posuere varius elit eu consequat. Sed vitae tortor scelerisque lacus eleifend condimentum. Nulla vitae neque sed lorem sagittis pretium eu nec est. Aliquam in euismod risus, vel vulputate orci.

Praesent sit amet auctor justo. Suspendisse pretium rutrum vehicula. Cras ut porta urna. Morbi massa odio, eleifend vitae dictum eget, mattis nec metus. Praesent pellentesque metus eu massa pharetra facilisis. Suspendisse potenti. Vestibulum pellentesque pharetra tristique. Nam ut lobortis felis. Proin sit amet consequat ipsum. Curabitur et mattis justo, sit amet feugiat lectus. Sed eleifend eget arcu non pretium. Suspendisse rhoncus erat quis leo laoreet rhoncus. Aliquam quis metus vitae enim cursus sodales. In euismod tortor id odio fermentum, non pretium ipsum iaculis. Quisque consectetur elementum nisi, et posuere odio vulputate ac. Ut consequat, velit eget fermentum ultrices, ligula odio fringilla diam, sit amet accumsan elit velit tempus dolor.

Jun 22, 2013 - Cum sociis natoque penatibus

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Phasellus fermentum facilisis velit eu auctor. Maecenas tincidunt, leo tempor bibendum auctor, ligula lorem ultricies tellus, ac auctor lorem libero a sapien. Donec ac suscipit tellus. Quisque vitae placerat lorem. In ullamcorper malesuada risus, eget fringilla lacus dignissim at. Proin faucibus, nibh vel molestie scelerisque, lorem urna tempus lacus, id viverra odio dolor sit amet odio. In hendrerit, orci vel scelerisque luctus, arcu purus aliquet turpis, a bibendum nulla est et dui.

Praesent pellentesque posuere lectus eget condimentum. Ut vitae nisi diam. Quisque vitae ipsum magna. Aliquam pretium laoreet tortor quis volutpat. Donec congue, nisl nec consequat varius, enim enim consectetur felis, a viverra libero elit in ligula. Cras posuere ipsum vel mi scelerisque, eu interdum velit elementum. Duis eu posuere est. Ut vestibulum urna eu viverra fringilla. Aliquam tempus nisi eros, vitae posuere nulla fermentum in. Praesent et justo eros. Proin eleifend justo vel justo condimentum ullamcorper. Curabitur vel vehicula lectus. Mauris sed ex ac ipsum ultrices bibendum at id tortor. Aenean dictum magna ac nisi posuere euismod. Ut fermentum, nulla quis venenatis varius, risus nulla dictum felis, ut dictum eros libero vitae justo.

Integer aliquam tellus vel libero eleifend, condimentum euismod odio tincidunt. Vivamus felis ante, faucibus quis urna nec, volutpat pulvinar quam. Cras dictum libero ac augue bibendum, et pretium ex pharetra. Vivamus suscipit et erat id eleifend. Proin vulputate, quam sit amet pretium fermentum, felis neque scelerisque metus, a rhoncus quam nisi sit amet urna. Sed et commodo libero, laoreet rutrum eros. Vivamus tempor, leo eget scelerisque molestie, sapien augue viverra tortor, et semper arcu eros ut elit. Sed pulvinar ipsum in semper facilisis.

May 22, 2013 - Nulla vel risus dapibus

Nulla vel risus dapibus, fringilla nunc id, interdum magna. Vivamus non diam egestas, bibendum elit sed, condimentum quam. Integer eu ipsum ultrices, tincidunt nibh at, auctor sem. Duis iaculis purus a aliquet gravida. Sed ornare, leo venenatis dignissim condimentum, nibh arcu iaculis dui, nec vulputate ante eros laoreet sem. Fusce dapibus, ante eu blandit tincidunt, odio quam vulputate libero, et interdum tellus lorem eleifend nisi. Nam elementum vel sapien sed rhoncus. Praesent commodo neque odio. Praesent a nisl nec neque laoreet dignissim. Quisque vitae felis a nisl sodales consequat ut ac mi. Etiam varius gravida accumsan. In sed lectus nec ipsum commodo efficitur. Ut vehicula diam eu justo pellentesque, in pulvinar lorem dapibus. Donec ornare metus vitae turpis malesuada, ut aliquet dolor vulputate. Aenean eget ipsum elit. Suspendisse tempor sagittis dictum.

Vivamus dapibus justo vitae tellus dignissim, non interdum odio egestas. Maecenas tincidunt sem non consequat bibendum. Aliquam cursus, enim sed rutrum porta, nisl tellus ultrices ipsum, vel vestibulum orci tellus sit amet quam. Pellentesque ut viverra lacus. Suspendisse potenti. Ut augue enim, hendrerit sed interdum sed, ullamcorper sit amet ex. Donec at mi at erat hendrerit commodo at non eros. Fusce commodo nec quam at rhoncus.

Aliquam molestie urna at turpis venenatis, et placerat lorem volutpat. Sed gravida arcu id lectus viverra eleifend. Sed in metus sit amet ante luctus dignissim. Etiam in sodales justo, in iaculis odio. Vestibulum accumsan felis vitae cursus pharetra. Nulla congue ipsum est, sed vulputate odio pulvinar id. Maecenas a sollicitudin turpis.

May 22, 2012 - Vivamus porttitor porta tortor

Vivamus porttitor porta tortor at ullamcorper. Proin vel nisi magna. Vivamus vel velit laoreet, malesuada nunc nec, pulvinar velit. Vivamus sollicitudin ex quam, sit amet aliquet velit euismod in. Etiam rutrum augue orci, sed euismod risus vehicula eu. Proin quis velit mattis, sodales erat vitae, condimentum nulla. Vestibulum vitae imperdiet ligula. Etiam venenatis ultrices varius.

Vestibulum vulputate nulla hendrerit velit tempor, et fringilla urna placerat. In hac habitasse platea dictumst. Vestibulum sit amet molestie tortor, eu posuere magna. Donec rhoncus pharetra urna sed tempor. Aliquam erat volutpat. Nulla facilisi. Nam at ante condimentum, egestas massa sed, auctor orci. Aenean tincidunt, turpis et venenatis finibus, orci urna tempor ex, at mattis nisi nisi varius nisl. Pellentesque diam libero, dignissim vel nisl ut, placerat pharetra felis.

Curabitur venenatis neque eget odio tempor, vitae condimentum quam aliquam. Duis dui odio, auctor non ultricies nec, mollis nec elit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed eget elit at nisl auctor egestas. Vivamus nec turpis feugiat, dapibus metus et, fermentum lacus. Curabitur at blandit diam, non rutrum nulla. Quisque eget fermentum libero, in bibendum diam. Vestibulum eget porta est, in scelerisque metus. Donec in elit aliquet sapien ultrices tincidunt.