feat: Added navigation

fork · Apr 1, 2023 · a677c05 · a677c05
1 parent b5a0374
commit a677c05
Show file tree

Hide file tree

Showing 4 changed files with 84 additions and 3 deletions.
diff --git a/composer.json b/composer.json
@@ -5,7 +5,8 @@
     "getkirby/staticache": "^1.0",
     "wearejust/kirby-twig": "^5.0",
     "distantnative/retour-for-kirby": "^4.4",
-    "diesdasdigital/kirby-meta-knight": "^1.2"
+    "diesdasdigital/kirby-meta-knight": "^1.2",
+    "belugadigital/kirby-navigation": "^3.0"
   },
   "config": {
     "optimize-autoloader": true,

diff --git a/composer.lock b/composer.lock
diff --git a/site/blueprints/site.yml b/site/blueprints/site.yml
@@ -32,6 +32,15 @@ tabs:
             templates: article
             sortable: false
             max: 20
+  navigation:
+    icon: folder-structure
+    fields:
+      navigation:
+        label: Navigation
+        type: navigation
+        levels: 3
+        width: 2/3
+
   globals:
     icon: globe
   seotab:

diff --git a/site/snippets/header.php b/site/snippets/header.php
@@ -19,4 +19,30 @@
   <meta name="msapplication-TileColor" content="#000000"/>
   <meta name="theme-color" content="#000000"/>
 </head>
-<body>
+<body>
+  <header>
+    <nav>
+    <?php if($site->navigation()->isNotEmpty()): ?>
+      <ul>
+        <?php foreach($site->navigation()->toStructure() as $nav): ?>
+          <li>
+            <a href="<?php echo $nav->url(); ?>" <?php e($nav->isOpen(), 'aria-current') ?>>
+              <?php echo $nav->text() ?>
+            </a>
+            <?php if($nav->children()->isNotEmpty()): ?>
+              <ul>
+                <?php foreach($nav->children()->toStructure() as $child): ?>
+                  <li>
+                    <a href="<?php echo $child->url() ?>">
+                      <?php echo $child->text() ?>
+                    </a>
+                  </li>
+                <?php endforeach ?>
+              </ul>
+            <?php endif ?>
+          </li>
+        <?php endforeach ?>
+      </ul>
+    <?php endif ?>
+    </nav>
+  </header>