CODEWITHSUNDEEP
yamljekyll
Deepak Lamichhane
Deepak Lamichhane

Reputation: 22644

How do you create a Jekyll site?

Please tell me how to create a basic Jekyll site. I am especially confused about the file _config.yml and the YAML front matter.

Upvotes: 1

Views: 3360

Answers (1)

Alan W. Smith
Alan W. Smith

Reputation: 25445

I don't quite understand the wording of you questions, but I'll take a shot. I'm guessing you are referring to one of two things. Either the config file or the YAML front matter. Whichever one, see below for a basic primer to get a jekyll site up and running. It shows the usage of both in context.

In an empty directory, create the following:

  1. A new directory named _layouts.

  2. A new directory named _posts.

  3. A new directory named _site.

  4. A file named index.md with the following content:

    ---
layout: default
---

# My Jekyll site

Welcome to my Jekyll site

    (Note: the "layout: default" surrounded by the two lines of dashes is the YAML Front Matter. Specifying "default" means that jekyll will use the "default.html" file in the _layouts directory listed below.)

  5. A file named _config.yml with the following default content:

    safe:        false
auto:        false
server:      false
server_port: 4000
base-url:    /

source:      .
destination: ./_site
plugins:     ./_plugins

future:      true
lsi:         false
pygments:    false
markdown:    maruku
permalink:   date

maruku:
  use_tex:    false
  use_divs:   false
  png_engine: blahtex
  png_dir:    images/latex
  png_url:    /images/latex

rdiscount:
  extensions: []

kramdown:
  auto_ids: true,
  footnote_nr: 1
  entity_output: as_char
  toc_levels: 1..6
  use_coderay: false

  coderay:
    coderay_wrap: div
    coderay_line_numbers: inline
    coderay_line_numbers_start: 1
    coderay_tab_width: 4
    coderay_bold_every: 10
    coderay_css: style

There are two more files you'll want to create for the example,

  1. Inside the "_layouts" directory, a file named default.html with the following:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>My Jekyll Site</title>
</head>
<body>

    <!-- This will be replaced with your content -->
    {{ content }}


</body>
</html>

  2. Inside the "_posts" directory, a file named 2011-07-29-my-first-jekyll-post.md with the following:

    ---
layout: default
---

# My First Jekyll Post

The quick brown fox jumps over the lazy dog.

    (Note: Once again, the "layout: default" surrounded by the two lines of dashes is the YAML Front Matter and specifies that "default.html" will be used for the template.)

At this point the directory structure should look like this:

./_config.yml
./_layouts
./_posts
./_posts/2011-07-29-my-first-jekyll-post.md
./_site
./index.md

Once all that is setup, from the command line go to the directory that has the index.md file in it and run jekyll. You should see a quick report like:

Configuration from /some-path/_config.yml
Building site: . -> ./_site
Successfully generated site: . -> ./_site

Two output file will have been created:

  • ./_site/index.html
  • ./_site/2011/07/29/my-first-jekyll-post.html

Those files correspond to the two markdown files after the were transformed to HTML and dropped into the default.html wrapper replacing the "{{ content }}" string.

That should get your started with the basics.

Upvotes: 15

Related Questions