using astro

src/components/SiteSidebar.astro

@@ -0,0 +1,26 @@
+---
+const sidebarItems = [
+  { href: "/the-founders.html", label: "The Founders" },
+  { href: "/services.html", label: "Sunday Services" },
+  { href: "/contact.html", label: "Contact" },
+  { href: "/speeches/", label: "Speeches" },
+];
+---
+
+<div id="secondary" class="widget-area sidey" role="complementary">
+  <ul class="xoxo">
+    <li id="nav_menu-2" class="widget-container widget_nav_menu">
+      <div class="menu-menu-3-side-bar-menu-container">
+        <ul id="menu-menu-3-side-bar-menu" class="menu">
+          {
+            sidebarItems.map((item, index) => (
+              <li class={`menu-item menu-item-${index + 1}`}>
+                <a href={item.href}>{item.label}</a>
+              </li>
+            ))
+          }
+        </ul>
+      </div>
+    </li>
+  </ul>
+</div>