Description

BeePixel Header Footer Builder for Elementor lets you design and manage custom header and footer templates using the Elementor page builder. No coding required.

This plugin is free. If it helps your project, consider supporting on Patreon.

Template Types

Create four types of templates:

Header — a custom header for your site
Footer — a custom footer for your site
Before Header — a zone above the header, useful for announcement bars
After Footer — a zone below the footer

Adding or Replacing the Theme Header

By default a template is added alongside your theme’s own header or footer, so nothing in your existing design changes unexpectedly.

Each template also has a Replace the theme’s own header / footer option. Turn it on and the plugin takes over the theme’s header or footer hook. Automatic replacement is supported on Astra, GeneratePress, OceanWP, Hello Elementor, Neve, Kadence, Blocksy, Storefront and Genesis.

On any other theme, add do_action( 'bphfe_header' ); or do_action( 'bphfe_footer' ); to your child theme wherever you want the template to appear.

Display Conditions

Control where each template appears:

Entire Website
Front Page / Homepage
All Singular Posts & Pages
All Posts
All Pages
All Archive Pages
Search Results
404 Error Page
WooCommerce Shop Page
WooCommerce Product Pages
WooCommerce Cart Page
WooCommerce Checkout Page

Exclude Specific Pages

Enter page or post IDs to prevent a template from showing on specific pages.

User Role Targeting

Show templates based on user status:

All Users
Logged In Users Only
Logged Out / Guest Users Only
Specific WordPress roles (Administrator, Editor, Subscriber, and so on)

Additional Options

Canvas Template — remove the theme wrapper when previewing a template on its own
Shortcode — embed any published template anywhere using [bphfe_template id="POST_ID"]

How to Use

Install and activate the plugin. Elementor must be active.
Go to BeePixel HFE in your WordPress dashboard.
Click Add New, enter a name, and publish.
Design your template in Elementor.
In the Template Settings meta box, set the template type and display conditions.
Publish — your template is now live.

Shortcode Usage

Find the template post ID in the URL when editing it (for example post=123), then use:

[bphfe_template id="123"]

Developer Hooks

do_action( 'bphfe_before_header' ) — print the Before Header template
do_action( 'bphfe_header' ) — print the Header template
do_action( 'bphfe_footer' ) — print the Footer template
do_action( 'bphfe_after_footer' ) — print the After Footer template
apply_filters( 'bphfe_theme_hook_map', $map ) — add or change theme replacement hooks
apply_filters( 'bphfe_active_template', $id, $type ) — override the resolved template
apply_filters( 'bphfe_enable_body_fallback', true ) — disable the after-<body> fallback

Installation

Go to Plugins > Add New and search for BeePixel Header Footer Builder for Elementor.
Click Install Now, then Activate.
Make sure Elementor is installed and active.
Go to BeePixel HFE in the admin menu to get started.

Or upload manually via Plugins > Add New > Upload Plugin.

FAQ

Does this require Elementor Pro?: No. The free version of Elementor is sufficient.
Does it replace my theme’s header?: Only if you ask it to. Each template has a “Replace the theme’s own header / footer” checkbox, which is off by default. With it off, your template is added alongside the theme’s header.
My theme is not in the supported list. What now?: Add do_action( 'bphfe_header' ); to your child theme where the header should appear, and do_action( 'bphfe_footer' ); for the footer. With the replace option off, the template is injected after the opening <body> tag automatically.
Can I create multiple headers for different pages?: Yes. Create as many templates as needed and assign display conditions to each one. When several templates match the same request, the first one in menu order is used.
Does it work with WooCommerce?: Yes. Display conditions include Shop, Product, Cart and Checkout pages.
Can I show different headers for logged-in and logged-out users?: Yes. Use the User Roles condition to target specific user types.
How do I exclude a page from a template?: Enter the page ID in the Exclude field inside the Template Settings meta box.
What is the shortcode for embedding a template?: Use [bphfe_template id="POST_ID"] where POST_ID is the ID of a published template.

Reviews

aljobair ماي 19, 2026

I tried a couple of other header footer plugins but faced responsive issues on mobile. Beepixel works flawlessly across all devices. The sticky header option is smooth and doesn't glitch. 5 stars!

Read all 0 reviews

Contributors & Developers

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

Jobair Hossain

Translate “BeePixel Header Footer 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.0.5

Fix: Template output is no longer passed through wp_kses_post(), which stripped style, svg, script, form, input, select and iframe tags. Icons, search widgets, embedded media and template CSS now render correctly.
Fix: The “404 Error Page” display condition no longer appears unchecked after saving. PHP cast the numeric option key to an integer, so the strict comparison always failed and the setting could be lost on the next save.
Fix: Page exclusions now use the queried object instead of the current loop post, so the header and the footer evaluate the same page.
Fix: Elementor’s generated template CSS is now enqueued before wp_head finishes, removing the flash of unstyled header.
Fix: The shortcode now only renders published templates belonging to this plugin. Previously any post ID could be rendered.
New: Optional “Replace the theme’s own header / footer” setting, with support for Astra, GeneratePress, OceanWP, Hello Elementor, Neve, Kadence, Blocksy, Storefront and Genesis.
New: bphfe_header, bphfe_footer, bphfe_before_header and bphfe_after_footer action hooks for unsupported themes, plus an automatic after-body fallback.
Improved: Template lookup now uses a single cached query per request instead of up to twelve.
Improved: Saved settings are validated against the known option lists.
Improved: Inline styles moved to stylesheets, standalone template URLs are now noindex, and uninstall removes trashed templates and plugin options.

1.0.4

Fix: Consistent version numbers
Fix: Output escaping changes
Improved: Frontend CSS z-index and positioning

1.0.3

Fix: Frontend CSS adjustments

1.0.2

Fix: Added theme-specific hooks for Astra, GeneratePress, OceanWP
Fix: Added universal fallback for themes without wp_body_open support
Improved: Header now renders correctly on all WordPress themes

1.0.1

Fix: Header template now renders correctly in page body instead of head section
Fix: Resolved CSS output appearing as raw text on frontend

1.0.0

Initial release
Header, Footer, Before Header and After Footer template types
12 display conditions including WooCommerce support
User role targeting
Exclude specific pages by ID
Elementor Canvas Template support
Shortcode support: [bphfe_template id=”123″]

Description

Template Types

Adding or Replacing the Theme Header

Display Conditions

Exclude Specific Pages

User Role Targeting

Additional Options

How to Use

Shortcode Usage

Developer Hooks

Installation

FAQ

Does this require Elementor Pro?

Does it replace my theme’s header?

My theme is not in the supported list. What now?

Can I create multiple headers for different pages?

Does it work with WooCommerce?

Can I show different headers for logged-in and logged-out users?

How do I exclude a page from a template?

What is the shortcode for embedding a template?