2. A few basics
•
Jekyll is static site generator written in ruby.
•
This means jekyll takes text files, written in markdown
or textile, and combines them with user generated
templates to form html pages.
•
Jekyll is oriented towards blogs, but can be used to
host any kind of static site.
•
You care because you want a place online to show off
your projects and the things you know, and you want
to do it with tools you already use.
3. Tools we’re using:
•
RVM (or rbenv) to manage ruby versions. You don’t
have to it’s just a bit easier
•
Ruby 2.0
•
Ruby Gems
•
Git
•
A Github account
•
A text Editor
4. Installing Ruby
1. Open up a terminal window and type the following:
curl -L https://get.rvm.io | bash -s stable —ruby
2. RVM should modify your dot files (.bashrc .zshrc etc
unless you tell it not to). So you need to source them
again.
3. Ruby 2.0 should have been installed, but if not you
can rvm install 2.0.0 & rvm use 2.0.0
4. You can learn more about RVM installation from
www.rvm.io
5. Installing Jekyll
•
Now that we have ruby installed, it’s time to install jekyll
•
gem install jekyll
•
This should install all the necessary gems to run your jekyll
site
•
Move to the directory where you are going to store your
site
•
jekyll new <site-name>
•
That’s it!
6. Getting set up on Github
•
Github supports jekyll out of the box to generate static web pages
•
Our local IU Github will work, but it will be cooler to use github.com
•
Create a new repository on github.com named <github-username>.github.io
•
Change directories to your new jekyll site folder (in your terminal) and run
the following
•
git init
•
git remote add origin git@github.com:<github-username>/<githubusername>.github.io.git
•
Now any commit that you push to the origin remote will trigger a
regeneration of your jekyll site, which will be available at <githubusername>.github.io
7. The Directory Structure
•
_config.yml is where all of your configuration data goes
•
_drafts is for drafts
•
_posts is for more finished posts, these have a different naming
scheme
•
_layouts holds the layout files that you specify for pages or posts
•
_includes holds partials which can be used with liquid {% include %}
tags
•
_site holds the generated site
•
index.html or index.md is the homepage of your site
8. Post files
•
Posts are either written in markdown or textile
•
Each posts starts with a block of YAML front matter which
specifies the title, layout and some other configuration data.
It all goes between two sets of “—“
•
Everything in the body of the post gets placed in the
{{ content }} tag in your layout file.
•
Post files should be named like this YEAR-MONTH-DAYtitle.MARKUP. For instance: 2013-11-08-jekyllintroduction.md is a post that is published on November 8th
titled “Jekyll Introduction”
9. Using the jekyll gem
•
In order to build your site locally, you run jekyll build, which
will place your generated site into the _site folder.
•
Jekyll will copy any file or folder that doesn’t start with an
underscore into the _site folder.
•
Any file with YAML frontmatter will be parsed by jekyll and
converted to HTML.
•
Files and folders with an underscore are not copied.
•
Jekyll comes with a built in server to test your site before
you publish it. jekyll serve starts a server on port 4000.
10. Wrap Up
•
Jekyll has many more options than what we just covered.
•
The jekyll homepage: www.jekyllrb.com has all of the
documentation on how to use all of jekyll’s features.
•
This page http://jekyllrb.com/docs/sites/ has good examples of
jekyll sites that you can check out to help you start your own
•
Check the resources page (http://jekyllrb.com/docs/resources/)
for a few helpful blog posts from other jekyll users
•
The liquid wiki (http://docs.shopify.com/themes/liquid-basics) will
give you everything you need to set up your templates in _layouts
