Title: Groundworx Navigation – Responsive Menu & Mobile Navigation Block
Author: Groundworx
Published: جولائی 9, 2025
Last modified: اپریل 1, 2026
---
پلگ انز تلاش کریں
# Groundworx Navigation – Responsive Menu & Mobile Navigation Block
منجانب [Groundworx](https://profiles.wordpress.org/alexandrie/)
[ڈاؤن لوڈ کریں](https://downloads.wordpress.org/plugin/groundworx-navigation.1.1.0.zip)
* [تفصیلات](https://ur.wordpress.org/plugins/groundworx-navigation/#description)
* [جائزے](https://ur.wordpress.org/plugins/groundworx-navigation/#reviews)
* [انسٹالیشن](https://ur.wordpress.org/plugins/groundworx-navigation/#installation)
* [ڈیولپمنٹ](https://ur.wordpress.org/plugins/groundworx-navigation/#developers)
[معاونت](https://wordpress.org/support/plugin/groundworx-navigation/)
## تفصیل
**Groundworx Navigation** is a powerful **responsive navigation block** for WordPress
block themes. Build professional navigation menus, mobile-responsive hamburger menus,
modal overlays, dropdown navigation, and sticky headers—all with native Gutenberg
blocks. No coding required.
Perfect for **theme.json block themes**, this navigation block gives you complete
control over your site’s header navigation, mobile menu behavior, and responsive
breakpoints.
#### Why Choose Groundworx Navigation?
Replace complex navigation plugins with a native Gutenberg block solution. Whether
you need a simple navigation bar, mobile hamburger menu, full-screen modal overlay,
or off-canvas slide-in drawer—Groundworx Navigation handles it all.
**Perfect for:**
* Block theme developers building custom navigation headers *
Sites requiring mobile-first responsive navigation menus * Accessibility-focused
WordPress navigation * Portfolio and business sites with sticky navigation headers*
Multi-level navigation structures and deep site menus
#### Key Features
**Native Gutenberg Navigation Block**
Build your navigation menu entirely in the
WordPress Block Editor—no shortcodes, no legacy menu screens, just blocks.
**Four Responsive Layout Templates**
– **Modal Navigation** – Full-screen overlay
menu for mobile devices – **Modal Dropdown** – Dropdown header navigation on desktop,
modal on mobile – **Slide-In Navigation** – Off-canvas drawer navigation from right
edge – **Classic Navigation** – Traditional navigation bar with hamburger menu collapse
**Multiple Menu Display Styles**
Accordion menus · Accordion Alt · List navigation·
Vertical menus · Horizontal navigation bars — mix and match with any layout template.
**Smart Responsive Behavior**
Set responsive breakpoints (`tablet`, `laptop`, `
desktop`, `large-desktop`) and watch your navigation automatically collapse to a
hamburger menu or modal overlay at your chosen screen size.
**Flexible Position Controls**
Relative, Sticky Header, Fixed Navigation, or Scroll-
Up Reveal—create sticky navigation headers without writing custom CSS.
**Accessibility-First Navigation**
Built-in focus traps, ESC key close, arrow-key
navigation, and proper ARIA attributes make your menu accessible by default.
**Branding Integration**
Add **Site Logo**, **Site Title**, or **Site Tagline**
blocks anywhere in your navigation header for seamless branding.
**Lightweight & Fast**
No jQuery bloat. Powered by WordPress’s native Interactivity
API with vanilla JavaScript—no external libraries needed for responsive navigation.
**Submenu Controls**
* Control nesting depth (1-5 levels) for complex navigation
structures * Indent or flatten submenu display * Hover or click to open dropdown
submenus * Icon controls for submenu indicators
#### Navigation Templates In Detail
**Modal Navigation**
Perfect for mobile-first sites. Creates a full-screen overlay
navigation menu that slides in from the top or side. Ideal for clean, distraction-
free mobile navigation.
**Modal Dropdown Navigation**
Best of both worlds: traditional dropdown navigation
on desktop, modal overlay on mobile devices. Great for sites with many navigation
items.
**Slide-In Navigation**
Off-canvas navigation drawer that slides in from the right
edge. Popular for modern web apps and mobile-optimized sites.
**Classic Navigation**
Traditional horizontal navigation bar that collapses to
a hamburger menu icon on smaller screens. The most familiar navigation pattern for
users.
#### Block Theme Ready
Groundworx Navigation is built specifically for **theme.json block themes**. Works
perfectly with:
* Twenty Twenty-Four * Twenty Twenty-Five * Blockbase * Frost *
Any FSE (Full Site Editing) block theme
**Note:** Requires a theme.json-ready block theme. Not compatible with classic PHP
themes.
## اسکرین شاٹس
* [[
* Block Editor – Navigation layout templates in Inspector settings
* [[
* Slide-In navigation drawer on mobile
* [[
* Modal navigation full-screen overlay
* [[
* Classic navigation bar with hamburger menu
* [[
* Dropdown navigation with submenus
* [[
* Sticky header navigation in action
## انسٹالیشن
#### Automatic Installation
1. Go to **Plugins Add New** in your WordPress admin
2. Search for "**Groundworx Navigation**"
3. Click **Install Now** then **Activate**
4. Add the **Groundworx Navigation** block in the Block Editor
#### Manual Installation
1. Download the plugin zip file
2. Upload to `/wp-content/plugins/` or install via **Plugins Add New Upload Plugin**
3. Activate **Groundworx Navigation**
4. Start building responsive navigation menus in the Block Editor
#### Quick Start Guide
1. In the Block Editor, add the **Groundworx Navigation** block
2. Choose a navigation layout template (Modal, Slide-In, Dropdown, or Classic)
3. In **Menu Settings**, click **Create New Menu** or select existing navigation menu
4. Insert **Navigation Menu**, **Branding**, or **Spacer** blocks
5. Configure responsive breakpoint, sticky header, accordion/list display in **Layout
Settings**
6. Publish and view your responsive navigation menu—no coding required
## عمومی سوالات
### Does this replace WordPress core Navigation block?
Groundworx Navigation is an alternative focused on complex responsive layouts—modal
overlays, slide-in navigation, sticky headers, hamburger menus—without requiring
custom CSS. Both navigation blocks can coexist in WordPress.
### Why can’t I select Fixed or Scroll-Up Reveal position?
Fixed and Scroll-Up Reveal navigation positions only appear when the block is placed
inside a `Header` template part. In regular page content, only **Relative** and **
Sticky** positions are available for navigation menus.
### What responsive breakpoints are available?
Choose from `tablet`, `laptop`, `desktop`, or `large-desktop` breakpoints—matching
Groundworx breakpoint utilities. Set **Toggle Behaviour Responsive** in navigation
settings and pick your breakpoint.
### Which menu display styles are included?
Accordion, Accordion Alt, List, Vertical, and Horizontal navigation displays. Each
menu style works with any layout template (Modal, Modal Dropdown, Slide-In, or Classic
navigation).
### Will this work with my WordPress theme?
Groundworx Navigation requires a **theme.json block theme** (also called FSE or
Full Site Editing theme). If you’re using a classic PHP theme or older block theme
without full theme.json support, the navigation block won’t function correctly.
**Solution:** Use a modern block theme like Twenty Twenty-Four, Twenty Twenty-Five,
Blockbase, or Frost—all fully compatible with Groundworx Navigation.
### Can I create mega menus with multiple columns?
Yes! Use the flexible block structure to create multi-column navigation menus and
mega menu layouts within any navigation template.
### Does it work with WooCommerce?
Absolutely. Groundworx Navigation works with any WordPress block theme, including
WooCommerce-enabled sites. Build custom navigation menus with your product categories.
### Is the navigation mobile-responsive?
Yes! That’s the core feature. Choose responsive behavior and breakpoints, and your
navigation automatically adapts—collapsing to a hamburger menu, modal, or slide-
in drawer on mobile devices.
### Can I have sticky navigation headers?
Yes. Select **Sticky** or **Fixed** position in navigation settings to create sticky
header navigation that stays visible while scrolling.
## جائزے
There are no reviews for this plugin.
## شراکت دار اور ڈیویلپرز
“Groundworx Navigation – Responsive Menu & Mobile Navigation Block” اوپن سورس سافٹ
ویئر ہے۔ مندرجہ ذیل لوگوں نے اس پلگ ان میں حصہ لیا:
شراکت دار
* [ Groundworx ](https://profiles.wordpress.org/alexandrie/)
[“Groundworx Navigation – Responsive Menu & Mobile Navigation Block” کا اپنی زبان میں ترجمہ کریں۔](https://translate.wordpress.org/projects/wp-plugins/groundworx-navigation)
### ڈویلپمینٹ میں دلچسپی ہے؟
[کوڈ براؤز کریں](https://plugins.trac.wordpress.org/browser/groundworx-navigation/)،
[ایس این وی ریپوزیٹری](https://plugins.svn.wordpress.org/groundworx-navigation/)
کو چیک کریں یا [ڈویلپمینٹ لاگ](https://plugins.trac.wordpress.org/log/groundworx-navigation/)
کو سبسکرائب کریں بذریعہ [آر ایس ایس](https://plugins.trac.wordpress.org/log/groundworx-navigation/?limit=100&mode=stop_on_copy&format=rss)۔
## چینج لاگ
#### 1.1.0
* Consolidated all block assets into central editor/style handles (removed per-
block file references)
* Refactored all block registrations to use central entry point pattern
* Added PHP namespaces to block renderers and utility files
* Fix: Submenu color controls now display correctly for classic layout
* Improved internationalization for editor panel titles, toolbar buttons, and breakpoint
labels
* Hardened output escaping for inline CSS values in block render callbacks
* Fix: `aria-label` now applied to `