Description
SanBar Menu Maker is a modular menu builder for WooCommerce stores. Create as many menus as you need, of four different types, and drop them anywhere on the site via shortcode. Every menu is edited in a split-screen editor with a live preview against your real theme.
Menu types included
- Mega Menu — horizontal top bar with hover dropdowns of subcategories. Hides below a configurable breakpoint. Ideal for the desktop header.
- Accordion — vertical menu with banner images per category and expandable panels of subcategories. Ideal for mobile and landing pages.
- Tiles — image grid of categories with title overlay. Adjustable columns, aspect ratio and hover zoom.
- Top Bar — simple horizontal link bar. Configurable separators, alignment and wrap/scroll overflow.
Highlights
- Multiple menus — unlimited menus of any type, each independently configured.
- Local category order — the order set inside a menu is local to that menu; WooCommerce category order (term_order, menu_order) is never modified.
- Media Library banners — banners are stored as attachment IDs, with srcset, lazy loading and proper WordPress image sizing.
- Live preview — the right pane shows your real theme with the menu rendered inside. Every change autosaves and refreshes the preview without a full reload; open accordion panels stay open.
- Drag-and-drop reordering — reorder categories by dragging the handle. No page reload.
- Independent enable/expand — disabling a category no longer collapses its edit fields.
- Full i18n — Portuguese (pt_BR) and English (en_US) shipped; anyone can add more.
- HPOS compatible — declared compatible with WooCommerce’s high-performance order storage.
- SB Softwares Hub integration — appears as a submenu of the SB Softwares Hub when installed, or as a standalone top-level menu otherwise.
- Legacy migration — one-click import from the previous sanbazar-mega-menu-v2 and sanbazar-menu-accordion plugins. Slugs are resolved to term IDs and banner URLs to attachment IDs automatically.
Shortcodes
[sanbar_mega_menu id="X"][sanbar_accordion id="X"][sanbar_tiles id="X"][sanbar_topo id="X"]
The id attribute is optional. When omitted, the plugin uses the first published menu of that type.
Screenshots
Installation
- Upload the plugin folder to
/wp-content/plugins/or install through the WordPress plugin screen. - Activate the plugin.
- Make sure WooCommerce is active.
- Go to SanBar Menu Maker (or SB Softwares Menu Maker if the Hub is installed) to create your first menu.
- If you had the old sanbazar mega menu or accordion plugin installed, an admin notice offers to import your existing settings.
FAQ
-
Does it change WooCommerce category order?
-
No. The order you set inside a menu is local to that menu. WooCommerce category order and
menu_ordervalues are never touched. -
Yes. Create as many mega menus, accordions, tiles or top bars as needed. Each has its own shortcode with the menu ID.
-
Does the live preview affect the site?
-
No. Menus stay in draft while you edit them; nothing appears on the front-end until you click Publish. The preview iframe is only visible to authenticated administrators.
-
How do I migrate from the old plugins?
-
Install and activate SanBar Menu Maker. The old plugins can remain installed. A blue admin notice will appear on the listing screen with a Run migration button. Migration is idempotent — running it again does no harm and does not create duplicates; a menu already migrated from a given source is simply skipped.
-
Is it compatible with High-Performance Order Storage (HPOS)?
-
Yes. The plugin declares compatibility with
custom_order_tables. -
Where can I translate strings I don’t like?
-
Edit
languages/sanbar-menu-maker-{locale}.poin the plugin folder and compile it to.mo(any Poedit-like tool does this in a click). WordPress will pick it up automatically. -
This almost always means the shortcode ended up wrapped in an element it shouldn’t be in. Two common causes:
- A “Code” element instead of a “Shortcode”/”HTML” element. Some header/page builders offer a “Code” block meant for displaying code snippets (like documentation), which wraps its content in
<code>tags. If you paste a shortcode there, the browser applies<code>‘s default styling (monospace font, background, padding) to the menu, and this can cascade into visibly wrong heights or fonts. Use your builder’s plain “Shortcode” or “HTML”/”Custom HTML” element instead — never a “Code”/”Display code” one. - A leftover
<p>tag around the shortcode. Some classic/visual editors auto-wrap loose text in<p>...</p>, including shortcodes typed on their own line. Since block-level output (like a nav bar) isn’t valid inside a<p>, browsers silently “fix” the HTML by splitting the paragraph, which can introduce extra margin or stray empty elements around the menu. If you can, switch to the block’s “Code”/”Text” view and remove any<p>and<code>tags surrounding the shortcode, leaving just[sanbar_mega_menu id="X"]on its own.
Each menu type also includes a defensive CSS reset that neutralizes the most common leaked styles (font, background, padding, border) if it ends up inside an unexpected wrapper — but placing the shortcode in the correct element type is still the more reliable fix.
- A “Code” element instead of a “Shortcode”/”HTML” element. Some header/page builders offer a “Code” block meant for displaying code snippets (like documentation), which wraps its content in
Reviews
There are no reviews for this plugin.
Contributors & Developers
“SanBar Menu Maker” is open source software. The following people have contributed to this plugin.
Contributors
Translate “SanBar Menu Maker” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
1.0
- Initial release.