Add breadcrumb navigation include

- Disable by default
- Add schema.org markup
- Add basic styling

_config.yml

@@ -7,14 +7,17 @@
 
 # Site Settings
 locale                   : en_US
-title                    : "Your awesome site"
-name                     : &name "Your Name"
+title                    : "Your Awesome Site"
 title_separator          : "-"
+name                     : &name "Your Name"
 description              : &description "Write an awesome description for your new site here."
 url                      : "http://localhost:4000" # the base hostname & protocol for your site
 baseurl                  : "/minimal-mistakes" # the subpath of your site, e.g. /blog
 email                    : "your-email@domain.com"
 logo                     : "site-logo.png"
+breadcrumbs              : # true / false (default)
+breadcrumb_home_label    : "Home"
+breadcrumb_separator     : "/"
 twitter:
   username               : &twitter "site_twitter"
 facebook:
@@ -135,7 +138,7 @@ gems:
   - jekyll-gist
 
 # Outputting
-permalink: /:title/
+permalink: /:categories/:title/
 paginate_path: /page:num
 timezone: America/New_York # http://en.wikipedia.org/wiki/List_of_tz_database_time_zones
 

_includes/breadcrumbs.html

@@ -0,0 +1,25 @@
+<nav class="breadcrumbs">
+  <ol itemscope itemtype="http://schema.org/BreadcrumbList">
+    {% assign crumbs = page.url | split: '/' %}
+    {% assign i = 1 %}
+    {% for crumb in crumbs offset: 1 %}
+      {% if forloop.first %}
+        <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
+          <a href="{{ absurl }}/" itemprop="item"><span itemprop="name">{{ site.breadcrumb_home_label }}</span></a>
+          <meta itemprop="position" content="{{ i }}" />
+        </li>
+        <span class="sep">{{ site.breadcrumb_separator }}</span>
+      {% endif %}
+      {% if forloop.last %}
+        <li class="current">{{ page.title }}</li>
+      {% else %}
+        {% assign i = i | plus: 1 %}
+        <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
+          <a href="{{ absurl }}{% assign crumb_limit = forloop.index | plus: 1 %}{% for crumb in crumbs limit: crumb_limit %}{{ crumb | append: '/' }}{% endfor %}" itemprop="item"><span itemprop="name">{{ crumb | replace: '-', ' ' | replace: '%20', ' ' | capitalize }}</span></a>
+          <meta itemprop="position" content="{{ i }}" />
+        </li>
+        <span class="sep">{{ site.breadcrumb_separator }}</span>
+      {% endif %}
+    {% endfor %}
+  </ol>
+</nav>

_layouts/default.html

@@ -17,19 +17,23 @@ layout: compress
 
   {% if page.header.image %}
     <div class="image-wrap">
-    <img src=
-      {% if page.header.image contains "http" %}
-        "{{ page.header.image }}"
-      {% else %}
-        "{{ page.header.image | prepend: "/images/" | prepend: absurl }}"
+      <img src=
+        {% if page.header.image contains "http" %}
+          "{{ page.header.image }}"
+        {% else %}
+          "{{ page.header.image | prepend: "/images/" | prepend: absurl }}"
+        {% endif %}
+        alt="{{ page.title }}">
+      {% if page.header.caption %}
+        <span class="image-caption">{{ page.header.caption | markdownify | remove: "<p>" | remove: "</p>" }}</span>
       {% endif %}
-      alt="{{ page.title }}">
-    {% if page.header.caption %}
-      <span class="image-caption">{{ page.header.caption | markdownify | remove: "<p>" | remove: "</p>" }}</span>
-    {% endif %}
     </div><!-- /.image-wrap -->
   {% endif %}
 
+  {% if site.breadcrumbs %}
+    {% include breadcrumbs.html %}
+  {% endif %}
+
   <div id="main" role="main">
     <div class="author-profile">
       {% include author-profile.html %}

_pages/recipes-archive.html

@@ -1,7 +1,7 @@
 ---
 layout: archive
 title: "Recipes Archive"
-permalink: /recipes-archive/
+permalink: /recipes/
 ---
 {% include absolute-url.liquid %}
 {% include group-by-array.html collection=site.recipes field='categories' %}

_sass/page.scss

@@ -654,6 +654,7 @@ $button-size: 1.5rem;
 		}
 	}
 }
+
 /*
    Google search form
    ========================================================================== */
@@ -685,3 +686,20 @@ $button-size: 1.5rem;
 #goog-wm-sb {
 	@extend .btn;
 }
+
+/*
+   Breadcrumbs
+   ========================================================================== */
+
+.breadcrumbs {
+  ol {
+    padding: 0;
+    list-style: none;
+  }
+  li {
+    display: inline;
+  }
+  .current {
+    font-weight: bold;
+  }
+}