Multiple Sidebar Nav Lists (#2843)

Co-authored-by: Tom Manner <tsmanner@us.ibm.com>
Co-authored-by: iBug <git@ibugone.com>

_includes/nav_list

@@ -1,26 +1,27 @@
-{% assign navigation = site.data.navigation[include.nav] %}
-
 <nav class="nav__list">
   {% if page.sidebar.title %}<h3 class="nav__title" style="padding-left: 0;">{{ page.sidebar.title }}</h3>{% endif %}
   <input id="ac-toc" name="accordion-toc" type="checkbox" />
   <label for="ac-toc">{{ site.data.ui-text[site.locale].menu_label | default: "Toggle Menu" }}</label>
   <ul class="nav__items">
-    {% for nav in navigation %}
-      <li>
-        {% if nav.url %}
-          <a href="{{ nav.url | relative_url }}"><span class="nav__sub-title">{{ nav.title }}</span></a>
-        {% else %}
-          <span class="nav__sub-title">{{ nav.title }}</span>
-        {% endif %}
+    {% for navname in include.nav %}
+      {% assign navigation = site.data.navigation[navname] %}
+      {% for nav in navigation %}
+        <li>
+          {% if nav.url %}
+            <a href="{{ nav.url | relative_url }}"><span class="nav__sub-title">{{ nav.title }}</span></a>
+          {% else %}
+            <span class="nav__sub-title">{{ nav.title }}</span>
+          {% endif %}
 
-        {% if nav.children != null %}
-        <ul>
-          {% for child in nav.children %}
-            <li><a href="{{ child.url | relative_url }}"{% if child.url == page.url %} class="active"{% endif %}>{{ child.title }}</a></li>
-          {% endfor %}
-        </ul>
-        {% endif %}
-      </li>
+          {% if nav.children != null %}
+          <ul>
+            {% for child in nav.children %}
+              <li><a href="{{ child.url | relative_url }}"{% if child.url == page.url %} class="active"{% endif %}>{{ child.title }}</a></li>
+            {% endfor %}
+          </ul>
+          {% endif %}
+        </li>
+      {% endfor %}
     {% endfor %}
   </ul>
 </nav>

docs/_docs/10-layouts.md

@@ -747,6 +747,15 @@ defaults:
         nav: "docs"
 ```
 
+If you have multiple sidebar navs defined and want to include more than one on a page, the sidebar nav can also be a list.
+
+```yaml
+sidebar:
+  nav:
+    - main
+    - docs
+```
+
 ---
 
 ## Social sharing links