adolforeyna/WFK_theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement dynamic menus, search toggle with overlay, and series taxonomy with numbered layout

Browse Source
This commit is contained in:
Adolfo Reyna
2026-03-12 23:47:50 -04:00
parent 63fafb4489
commit e74d1268bc
4 changed files with 256 additions and 340 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
header.php
View File

@@ -6,10 +6,12 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&family=Playfair+Display:ital,wght@0,700;1,700&display=swap" rel="stylesheet">
<!-- Alpine.js for lightweight interactivity -->
<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.min.js"></script>
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<body <?php body_class(); ?> x-data="{ searchOpen: false }">
<?php wp_body_open(); ?>
<div id="page" class="site">
<header id="masthead" class="site-header">
@@ -19,19 +21,35 @@
<span class="logo-icon">W</span>
<span class="site-name">Wisdom for the Kingdom</span>
</a>
</div><!-- .site-branding -->
</div>
<nav id="site-navigation" class="main-navigation">
<?php
wp_nav_menu(
array(
'theme_location' => 'menu-1',
'menu_id' => 'primary-menu',
'container' => false,
'fallback_cb' => 'wisdom1_menu_fallback',
)
);
?>
</nav><!-- #site-navigation -->
<div class="nav-and-search">
<nav id="site-navigation" class="main-navigation">
<?php
wp_nav_menu(
array(
'theme_location' => 'menu-1',
'menu_id' => 'primary-menu',
'container' => false,
'fallback_cb' => 'wisdom1_menu_fallback',
)
);
?>
</nav>
<button class="search-toggle" @click="searchOpen = !searchOpen" aria-label="Toggle search">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>
</button>
</div>
</div>
</header><!-- #masthead -->
<!-- Search Overlay -->
<div class="search-overlay" x-show="searchOpen" x-transition:enter="fade-in" x-transition:leave="fade-out" @click.away="searchOpen = false" style="display: none;">
<div class="site-container">
<form role="search" method="get" class="search-form-overlay" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<input type="search" class="search-field-large" placeholder="Search wisdom..." value="<?php echo get_search_query(); ?>" name="s" x-ref="searchInput">
<button type="submit" class="search-submit-large">Search</button>
</form>
</div>
</div>
</header>