---
layout: default
---

<section class="docs">
  <div class="grid">
    {%- include tutorials_contents_mobile.html -%}
    <div class="unit four-fifths">
      <article>
        <header class="tutorial-header">
          <div class="improve right hide-on-mobiles">
            <a href="https://github.com/jekyll/jekyll/edit/master/docs/{{ page.path }}"><i
               class="fa fa-pencil"></i> &nbsp;Improve this page</a>
          </div>
          <h1 class="tutorial-title">{{ page.title }}</h1>
          {% assign author = page.author %}
          {% if author %}
            <div class="tutorial-meta">
              <span class="tutorial-date">
               {{ page.date | date_to_long_string }}
              </span>
              <a href="https://github.com/{{ author }}" class="tutorial-author">
                {% avatar user=author size=24 %}
                <span class="author-name">{{ author }}</span>
              </a>
            </div>
          {% endif %}
        </header>
        {{- content -}}
        {% if page.plugin_disclaimer %}
          <div class="disclaimer-ribbon">
            Disclaimer: The Jekyll Core Team does not endorse the Ruby code in this tutorial and is
            not liable to resolve any bugs therein or issues arising otherwise from the use of the
            provided example(s) in production builds.
          </div>
        {% endif %}
        {%- include section_nav_tutorials.html -%}
      </article>
    </div>
    {%- include tutorials_contents.html -%}
    <div class="clear"></div>
  </div>
</section>