Adjusting layout so that every Basics and Tags' content output their own pages

_config.yml

@@ -6,12 +6,20 @@ permalink: /:year/:month/:day/:basename:output_ext
 collections:
   basics:
     output: true
+    permalink: /basics/:path/
   filters:
     output: true
   tags:
     output: true
+    permalink: /tags/:path/
 exclude:
   - README.md
   - CNAME
   - node_modules
 keep_files: ['css']
+defaults:
+  -
+    scope:
+      path: "" # an empty string here means all files in the project
+    values:
+      layout: "default"

_layouts/default.html

@@ -21,21 +21,49 @@
         <a href="/">Liquid</a>
       </div>
       <nav class="sidebar--nav">
-        {% for collection in site.collections %}
-          {% assign section_title = collection[0] %}
-          <ul class="section">
-            <li>
-              <h3 class="section__header">{{ section_title | capitalize }}</h3>
-              <ul class="section__links">
-                {% for doc in site.collections[section_title].docs %}
-                  <li>
-                    <a href="/{{ collection[0] }}#{{ doc.title }}" class="section__link">{{ doc.title }}</a>
-                  </li>
-                {% endfor %}
-              </ul>
-            </li>
-          </ul>
-        {% endfor %}
+
+        <!-- Basics -->
+        <ul class="section">
+          <li>
+            <h3 class="section__header">Basics</h3>
+            <ul class="section__links">
+              {% for doc in site.collections["basics"].docs %}
+                <li>
+                  <a href="/basics/{{ doc.title | slugify }}" class="section__link">{{ doc.title }}</a>
+                </li>
+              {% endfor %}
+            </ul>
+          </li>
+        </ul>
+
+        <!-- Tags -->
+        <ul class="section">
+          <li>
+            <h3 class="section__header">Tags</h3>
+            <ul class="section__links">
+              {% for doc in site.collections["tags"].docs %}
+                <li>
+                  <a href="/tags/{{ doc.title | slugify }}" class="section__link">{{ doc.title }}</a>
+                </li>
+              {% endfor %}
+            </ul>
+          </li>
+        </ul>
+
+        <!-- Filters -->
+        <ul class="section">
+          <li>
+            <h3 class="section__header">Filters</h3>
+            <ul class="section__links">
+              {% for doc in site.collections["filters"].docs %}
+                <li>
+                  <a href="/filters#{{ doc.title }}" class="section__link">{{ doc.title }}</a>
+                </li>
+              {% endfor %}
+            </ul>
+          </li>
+        </ul>
+
       </nav>
     </div>
 

_tags/control-flow.md

@@ -2,12 +2,12 @@
 title: Control Flow
 ---
 
-Control Flow tags determine which block of code should be executed based on different conditions. 
+Control Flow tags determine which block of code should be executed based on different conditions.
 
 
-### if
+## if
 
-<p>Executes a block of code only if a certain condition is met.</p>      
+<p>Executes a block of code only if a certain condition is met.</p>
 
 <p class="input">Input</p>
 
@@ -28,9 +28,9 @@ These shoes are awesome!
 </div>
 
 
-### elsif / else
+## elsif / else
 
-<p>Adds more conditions within an <code>if</code> or <code>unless</code> block.</p> 
+<p>Adds more conditions within an <code>if</code> or <code>unless</code> block.</p>
 
 <p class="input">Input</p>
 
@@ -58,10 +58,9 @@ Hey Anonymous!
 
 
 
+## case/when
 
-### case/when
-
-<p>Creates a switch statement to compare a variable with different values. <code>case</code> initializes the switch statement, and <code>when</code> compares its values.</p>      
+<p>Creates a switch statement to compare a variable with different values. <code>case</code> initializes the switch statement, and <code>when</code> compares its values.</p>
 
 <p class="input">Input</p>
 
@@ -93,15 +92,9 @@ This is a cake
 
 
 
+## unless
 
-
-
-
-
-
-### unless
-
-<p>Similar to <code>if</code>, but executes a block of code only if a certain condition is <strong>not</strong> met.</p>      
+<p>Similar to <code>if</code>, but executes a block of code only if a certain condition is <strong>not</strong> met.</p>
 
 <p class="input">Input</p>
 

_tags/temp-index.md

@@ -1,15 +0,0 @@
----
-title: Tags
----
-
-
-Liquid _tags_ are the programming logic that tells templates what to do. Tags are wrapped in: <code>{&#37;</code> <code>&#37;}</code>. 
-
-Certain tags, such as <a href="#for"><code>for</code></a> and <a href="#cycle"><code>cycle</code></a> can take on parameters. Details for each parameter can be found in their respective sections. 
-
-Tags can be broken down into four categories:
-
-- [Control Flow Tags](/themes/liquid-documentation/tags/control-flow-tags/)
-- [Iteration Tags](/themes/liquid-documentation/tags/iteration-tags/)
-- [Theme Tags](/themes/liquid-documentation/tags/theme-tags/)
-- [Variable Tags](/themes/liquid-documentation/tags/variable-tags/)

tags/index.html

@@ -2,11 +2,5 @@
 layout: default
 ---
 
-{% for doc in site.collections["tags"].docs %}
-  <div id="{{ doc.title }}" class="content__item">
-    <h2 class="content__header">{{ doc.title }}</h2>
-    <div class="content">
-      {{ doc.content }}
-    </div>
-  </div>
-{% endfor %}
+Tags here.
+