Jekyll: static websites generator

I’ve been using for this site development.

Jekyll is the engine for static sites on the base of GitHub Pages. GH Pages technology allows browsing static sites on domain *.github.io.

I want to describe general aspects of working with it. Next, I give examples of commands used on Debian-based operational systems.

Installation

Let’s make ruby-dev is installed:

my@my-pc:~$ dpkg -l ruby-dev
Desired=Unknown/Install/Remove/Purge/Hold
| Status=Not/Inst/Conf-files/Unpacked/halF-conf/Half-inst/trig-aWait/Trig-pend
|/ Err?=(none)/Reinst-required (Status,Err: uppercase=bad)
||/ Name           Version      Architecture Description
+++-==============-============-============-==================================
ii  ruby-dev       1:1.9.3.4    all          Header files for compiling extensi

If not - we need install ruby-dev package:

my@my-pc:~$ sudo apt-get install ruby-dev

Now we are ready to install jekyll:

my@my-pc:~$ sudo gem install jekyll

Next, create directory for new site and run it:

my@my-pc:~$ jekyll new new_site
my@my-pc:~$ cd new_site
my@my-pc:~/new_site$ jekyll serve

Now site is available for browsing on address localhost:4000 (by default).

Configuration

You can change configuration after creation file _config.yml at the root of th project.

my@my-pc:~/new_site$ touch _config.yml

Config example:

name: ""
description: ""

url: "[YOUR DOMAIN]"

paginate: 10

markdown: rdiscount
permalink: pretty
pygments: true

Settings in details here.

Directories structure

Documentation Here.

Styles

Let’s create css-file in separate directory. Example.

For this site I use simple design, which must accent attention on information component.

Main page

Example Here.

On index.html main place is reserved for block, which displays links to posts. When linking, we can see contents of the post.

Template

Templates are in directory _layouts. Example of the simple template, which used for all pages of the site you can see here.

Posts

Posts must be in directory _posts. Each post - separate file which named in accordance with format ‘yyyy-mm-dd-[name].md’. Jekyll read each file in _posts and on the base of it generate html page [name].html in directory _site with hierarchical structure accordingly to specified date.

Used format for markup page with post - markdown.

Markdown markup for main page:

layout: default
title: "Jekyll: static websites generator"

---

default - is the template name.

At last

Let’s output posts list with links on the main page, using for + endfor (you can see this hint in index.html)

More details about Jekyll you can always find here.