Skip to content

Layouts

Jump to bottom
rbwestmoreland edited this page Jul 22, 2012 · 4 revisions

Layouts are YAML documents. Let's take a look at an example one.

head:
 html:
  - /_includes/head.html
 styles:
  - /styles/css/reset.css
  - /styles/css/site.css
 scripts:
  - /scripts/javascript/jquery.min.js
body:
 pre_content:
   - /_includes/header.html
 post_content:
   - /_includes/footer.html
 scripts:
  - /scripts/javascript/site.js
  • head This is html, styles, and scripts to include in the head tag.
  • body This is html, styles, and scripts to include in the body tag.

TIP: All portions of a layout are optional.
TIP: All html, styles, and scripts will be included in the order they appear in the layout.
TIP: All styles, and scripts will automatically bundled and minified.

Let's take a look at the HTML template.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <meta name="typeset-version" content="" />
    <title></title>
    <!--head html-->
    <!--head styles-->
    <!--head scripts-->
</head>
<body>
    <!--body pre-content-->
    <section id="content">
        <!--content-->
    </section>
    <!--body post-content-->
    <!--body scripts-->
</body>
</html>
Clone this wiki locally