Opscaler Mega Menu

Opscaler Mega Menu is a custom WordPress plugin that adds configurable mega menu fields to native WordPress navigation menus. It is designed for themes that use the primary menu location.

Features

• Enable a mega menu on top-level menu items.
• Add a mega menu heading and background image.
• Configure Bootstrap-based column widths for second-level menu items.
• Add row headings for third-level menu items.
• Render fourth-level content as images, titles, buttons, or repeatable icon boxes.
• Upload images through the WordPress media library.
• Sort, clone, and remove icon boxes from the menu editor.

Requirements

• WordPress 5.8 or newer.
• A theme that registers and renders a primary menu location.
• PHP 7.4 or newer.

Installation

1. Upload the opscaler-mega-menu folder to wp-content/plugins/.
2. Activate Opscaler Mega Menu from Plugins in the WordPress admin.
3. Go to Appearance > Menus.
4. Assign your menu to the primary theme location.

Usage

Mega menu content is controlled from Appearance > Menus using menu item depth:

• Depth 0: enable the mega menu, set the main heading, and choose a background image.
• Depth 1: configure a column size and optional column heading.
• Depth 2: configure a row and optional row heading.
• Depth 3: choose a content field type: image, icon box, title, or button.

The plugin automatically replaces the nav menu walker for the primary menu location when at least one top-level item has mega menu enabled.

Assets

The plugin loads:

• assets/css/opscaler-menu.css and assets/js/opscaler-menu.js on the frontend.
• assets/css/admin.css and assets/js/admin.js on the WordPress menu editor screen.
• Bootstrap 5.3 from jsDelivr for layout support.

Customization

Frontend styles can be adjusted in assets/css/opscaler-menu.css. Admin editor styles can be adjusted in assets/css/admin.css.

License

GPL-2.0-or-later