Description

Wbee Header Footer and Mega Menu Builder for Elementor (by Woodebee) is a focused theme-builder for site chrome. You design headers, footers, and mega-menu panels in Elementor. Easily attach mega menu panels to specific navigation menu items. You stay in control of layout, type, and color inside each template.

This plugin requires Elementor.

Theme Builder dashboard

Open Woodebee Header Footer in the WordPress admin.

Separate boards for Header, Footer, and Mega Menu
Create, duplicate, and delete templates
Edit with Elementor in one click
Header and footer Activate / Deactivate
Header and footer Conditions & Settings
Mega menus show Active when assigned to a menu item, Inactive when they are not

Display conditions (headers & footers)

Each header and footer can include and exclude pages. If several templates match, the most specific rule wins, then Priority.

Entire website, homepage, singular, archives, search, 404
Audience: everyone, logged in, or logged out
WooCommerce (when WooCommerce is active): shop, products, categories, cart, checkout, My account

Sticky, overlay, and responsive header

Set these on Conditions & Settings or in the header document in Elementor.

Transparent / overlay header over a hero
Sticky header with desktop, tablet, and mobile toggles
Scroll offset, optional shrink, blur, border, shadow, and scrolled colors
Optional hide-on-scroll-down (desktop)

Responsive hamburger and drawer

Header Nav is responsive by default. Below the chosen breakpoint the horizontal menu becomes a hamburger that opens a right-side drawer (off-canvas side panel).

Collapse below 1200px, 1024px (default), or 767px
Toggle icon and close icon (library or upload), plus toggle alignment
Full-height side panel with backdrop, close button, and Escape to dismiss
Style the drawer: width, padding, background, backdrop color, link colors
Preview live in Elementor by switching to tablet or mobile
A header template can also force this collapse under Conditions & Settings

When a Woodebee header or footer is active, matching theme chrome is hidden with CSS selectors from Woodebee Header Footer Settings.

Mega menus

Mega panels are normal Elementor documents. They do not use display conditions. They appear only where you attach them.

Create a mega template (blank or starter).
Design the inside in Elementor.
Go to Appearance Menus and open a top-level item.
Under Woodebee Mega Menu, choose the panel.
Set Panel width:
- Custom (default 900px, 240–1920) — centered under that item
- Full width — spans the navigation wrap
Optional badge and item icon class. Save the menu.

Parent items with a dropdown or mega show a caret. Mega content uses its own Elementor typography, padding, and line-height — not the parent nav styles. Hover stays open while you move from the item into the panel.

Starter layouts

Install from the dashboard Starter layouts row, then restyle in Elementor.

Studio header — Logo left, nav center, gold CTA. Sticky-ready.
Studio footer — Brand column, Quick Links / Work With Me / Socials Icon Lists, legal bar.
Gallery mega menu — Light featured panel, three link columns, gold CTA. Best as Custom width (~980px).

No remote images are bundled. Change copy, links, colors, and images after install.

Elementor widgets

Available in the Woodebee HF category while you edit a template.

Site Logo — custom image, Customizer logo, or site title
Header Nav — WordPress menu, mega panels, dropdowns, auto hamburger, off-canvas drawer, typography
Header CTA — gold / ink / ghost / outline button
Copyright — {year} and {site} tokens

Settings & privacy

Toggle hiding the theme header and footer
Edit the CSS selectors used to hide theme chrome
Templates and settings stay on your WordPress site

A longer walkthrough lives in docs/DOCUMENTATION.md inside the plugin folder.

Installation

Install and activate Elementor.
Upload this plugin or install it from Plugins Add New.
Activate Wbee Header Footer and Mega Menu Builder for Elementor.
Open Woodebee Header Footer to create a header, footer, or mega menu.

FAQ

Does this work without Elementor?: No. Elementor is required to edit templates. The plugin shows an admin notice until Elementor is active.
Will my theme header still show?: When a Woodebee header or footer is active, matching theme chrome is hidden using CSS selectors you can edit under Settings. Block themes such as Twenty Twenty-Five use header.wp-block-template-part instead of #site-header; those wrappers are hidden automatically.
Are mega menus full width?: Each menu item can use a custom width (centered under that item, default 900px) or full width of the navigation. Gallery starters work best at about 980px custom width. Editorial starters work best at full width.
Why is my mega menu Inactive?: Mega menus are Active only after you assign the panel to a WordPress menu item under Appearance Menus. They do not use display conditions.
Can I edit the starter layouts?: Yes. They are regular Elementor templates. Change text, links, and colors after install.
Where do I assign a mega panel?: Appearance Menus a top-level item Woodebee Mega Menu. Save the menu after you pick a template and width.
How does the mobile menu work?: Turn on Responsive menu on the Header Nav widget (it is on by default). Below the breakpoint a hamburger appears. Tapping it opens a right-side drawer with a backdrop. Style both under the widget Toggle & drawer tab.

Reviews

There are no reviews for this plugin.

Contributors & Developers

“Wbee Header Footer and Mega Menu Builder for Elementor” is open source software. The following people have contributed to this plugin.

Zihadul islam

Translate “Wbee Header Footer and Mega Menu Builder for Elementor” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Changelog

1.4.5

Front-end mega menus now use the styles from the Elementor mega template (typography, spacing, buttons, layout).
Header Nav and starter-kit CSS no longer override a custom mega design.
Sticky header colors no longer recolor mega panel content after scroll.
Block themes such as Twenty Twenty-Five no longer show a double header or footer next to the Woodebee template.

1.4.0

Renamed display name and slug for WordPress.org trademark compliance (does not begin with “woo”).
Slug / text domain: wbee-hfm-builder-elementor.
Kept “Tested up to” only in readme.txt.
Confirmed nonce and capability checks on admin/AJAX handlers.
Excluded WordPress.org directory banners/icons/screenshots from the plugin package.

1.3.9

Added a generated POT template and WordPress script translations for admin JavaScript.
Hardened menu item metadata saving with explicit nonce verification.
Replaced file-mtime asset versions and removed reflection-based Elementor category reordering.
Updated “Tested up to” for WordPress 7.1 and cleaned Plugin Check packaging issues.

1.3.8

Maintenance improvements for WordPress.org packaging readiness.

1.3.7

Two mega menu starters: Gallery (light) and Editorial (dark).
Detailed documentation and WordPress.org screenshots.

1.3.6

WordPress.org compliance: license headers, uninstall cleanup, sanitization, and translation domain.

1.3.5

Mega menu custom and full width options.

1.3.4

Load Elementor CSS for mega menus on non-Elementor pages.

Description

Theme Builder dashboard

Display conditions (headers & footers)

Sticky, overlay, and responsive header

Responsive hamburger and drawer

Mega menus

Starter layouts

Elementor widgets

Settings & privacy

Installation

FAQ

Does this work without Elementor?

Will my theme header still show?

Are mega menus full width?

Why is my mega menu Inactive?

Can I edit the starter layouts?

Where do I assign a mega panel?

How does the mobile menu work?