NavBridge Pro

VIDEO WALKTHROUGH

NavBridge Pro: setup guide

1:59

Recorded on version 1.0.2 · Narrated walkthrough · English captions

Jump to a chapter 6 chapters

1. 0:00Set up NavBridge Pro
2. 0:15Set the default column count
3. 0:33Choose your category inclusion rule
4. 0:54Review category-level controls
5. 1:17Check storefront rendering
6. 1:40Your setup checklist

Read the full video transcript

NavBridge Pro 1.0.2 — Magento Admin setup

00:00:00 — Set up NavBridge Pro
Welcome to the Agentic Ecom NavBridge Pro guide. We'll use Magento Admin to review the setup and explain the handoff to your headless storefront. This walkthrough covers stable version 1 point 0 point 2 and assumes the extension is installed.

00:00:15 — Set the default column count
Open Stores, Configuration, Nav Pro. Under General, set Default Mega Menu Columns for categories that do not supply their own value. In this release, the general group has a column default rather than a master enable switch. Check scope before editing.

00:00:33 — Choose your category inclusion rule
Open Category Allow and Deny. Inclusion Mode selects All except excluded or Only included. Choose the rule that matches your catalogue, then select the corresponding categories. Review the result carefully: an allow-only setup with no relevant categories selected will not produce the navigation you expect.

00:00:54 — Review category-level controls
Next, open Catalog, Categories and choose a top-level category. Expand Nav Pro Settings. Enable Mega Menu marks that category as a mega-menu trigger. Mega Menu Columns is its layout hint; the optional C M S block and icon provide promotional content and navigation artwork. Save your category changes when ready.

00:01:17 — Check storefront rendering
Your frontend developer reads the navigation metadata through the dedicated NavBridge queries or the added category fields. The module provides the data; your storefront renders the menu. After saving your settings and categories, refresh the relevant navigation data and verify it on desktop and mobile, including each intended store view.

00:01:40 — Your setup checklist
Your next steps are to set default columns and inclusion mode, configure the relevant categories, sync and verify the rendered menu. Use a staging store for the end-to-end check. The complete installation and integration reference is at user guides dot Agentic Ecom dot net.

Download videoEnglish captionsDownload transcript

A headless storefront still needs a real navigation menu — ideally a mega menu with columns, promo blocks and icons, not just a flat list of links. NavBridge Pro adds those controls to every Magento category and exposes the entire navigation structure over GraphQL, so your Astro (or any headless) frontend can build a rich, multi-column mega menu from a single query — driven by merchants in the normal category admin, with no front-end redeploy.

Install

Install NavBridge Pro with Composer using your AgenticEcom licence key (find it on your My Licences page — one key unlocks every module you own):

# 1. Register the AgenticEcom repository (once per store)
composer config repositories.agenticecom composer https://repo.agenticecom.net
composer config --global --auth http-basic.repo.agenticecom.net <YOUR-LICENCE-KEY> x

# 2. Require this module
composer require agenticecom/module-navbridgepro

# 3. Apply it
php bin/magento setup:upgrade && php bin/magento setup:di:compile && php bin/magento cache:flush

Have the whole platform?

Install every module in one command with composer require agenticecom/suite — see Install the complete suite.

Compatibility

Magento

Check the exact release against your Magento Open Source version.

PHP

Check the exact package requirements and test your PHP version.

Headless

Two dedicated GraphQL queries + native category fields.

Merchant-driven

Per-category controls in the standard category editor.

What it adds to each category

Open any category and you’ll find a NavBridge Pro Settings panel:

Control	What it does
Enable Mega Menu	Marks this top-level category as a mega-menu trigger (its children are returned grouped).
Mega Menu Columns	How many columns (1–5) the storefront should lay the children out in.
CMS Block Identifier	A CMS block to render in the mega menu’s promo area (e.g. a seasonal banner).
Navigation Icon	An icon (≤2 MB, jpg/png/gif/svg) shown next to the nav item.

Store-scoped, like every category field

Each control is per store view — switch the Scope selector at the top of the category page to give a German or B2B store a different mega-menu layout, columns or promo block from the default.

Serving navigation to a headless storefront

Mega menu

navBridgeMegaMenu returns the top-level, in-menu categories; any marked as a mega menu come back with their children and layout hints already attached.

{
  navBridgeMegaMenu {
    id name url_path
    nav_bridge_is_mega
    nav_bridge_columns
    nav_bridge_cms_block
    nav_bridge_icon
    children { id name url_path }
  }
}

Full tree

navBridgeCategoryTree returns the whole active category tree (optionally depth-limited, or mega-only) as a nested structure ready to render.

{
  navBridgeCategoryTree(depth: 2) {
    id name level
    nav_bridge_columns
    children { id name children { id name } }
  }
}

On native queries

The four nav_bridge_* fields are also added to Magento’s native categories / categoryList queries, so if you already fetch categories you can just request the extra fields — no separate call needed.

{ categories(filters: {ids: {eq: "41"}}) {
    items { id name nav_bridge_is_mega nav_bridge_columns }
} }

Set it up

1. Open Catalog → Categories and pick a top-level category.

2. Expand NavBridge Pro Settings, turn on Enable Mega Menu, pick a column count, and (optionally) set a promo CMS block and icon. Save.

3. From your storefront, query navBridgeMegaMenu — the category comes back with its children, column count and promo block, ready to render as a mega menu.

Global controls under Nav Pro

There’s also a Stores → Configuration → AgenticEcom · Headless & Astro → Nav Pro section with a master Enabled switch, a Default Mega Menu Columns value (used when a category doesn’t set its own), and a Category Allow/Deny group — choose All except excluded or Only included and pick the categories — to scope exactly which categories reach the storefront mega-menu.

Safe & correct

Only active, in-menu categories

Both queries filter to active categories (and the mega menu to include-in-menu), so a disabled or hidden category never appears in your navigation.

Nested tree, done right

navBridgeCategoryTree builds a proper parent→child tree from the category path, with an optional depth limit and a mega-only filter for lean menu payloads.

FAQ

Do I have to use the dedicated queries?

No. The nav_bridge_* fields are merged onto Magento’s native categories and categoryList queries, so if your storefront already loads the category tree you can just add the extra fields. The navBridgeMegaMenu / navBridgeCategoryTree queries are there when you want a ready-shaped menu in one call.

Will disabled categories show in the menu?

No — both resolvers filter to active categories, and the mega-menu query additionally requires include in menu, so anything hidden from the storefront stays out of the navigation.

Can different store views have different mega menus?

Yes — every NavBridge field is store-scoped, so each store view can have its own mega-menu layout, column count, promo block and icons. Set the Scope selector on the category page before editing.

What does the column count actually do?

It’s a layout hint your storefront reads (nav_bridge_columns, 1–5) to decide how many columns to arrange a category’s children into. Rendering lives in your theme/storefront, so you stay in full control of the markup. Check exact-release compatibility before deployment.