Create custom headers and footers with Elementor, including display conditions and sticky header support.

Pitabas

Header & Footer with Elementor

Customize Header & Footer using the Elementor page builder.

Webnobby Agency

Elite Elementor Addons and Widgets

90+ free Elementor widgets, Header Footer Builder, Theme Builder, Popup Builder, WooCommerce Builder, Templates Library, Mega Menu, and Ajax Search.

Jobair Hossain

BeePixel Header Footer Builder for Elementor

Build custom headers and footers with Elementor. Includes display conditions, WooCommerce support, user role targeting, and announcement bars.

Joynal

Aura Header Footer for Elementor lets you design custom headers and footers with Elementor’s full drag-and-drop editor, then control exactly where they appear using flexible display conditions.
<h4>How It Works</h4>
<ol>
<li>Go to Aura HFE → Header Templates or Footer Templates.</li>
<li>Click Add New Header Template — a clean modal popup appears.</li>
<li>Set the template name, display condition, include/exclude pages, and sticky options.</li>
<li>Click Create — you land directly in the Elementor editor.</li>
<li>Design your template, publish, and it’s live.</li>
</ol>
<h4>Key Features</h4>
<ul>
<li>Modal creation flow — configure everything before opening Elementor.</li>
<li>Separate Header & Footer pages — clean dedicated admin pages for each type.</li>
<li>Display Conditions — Entire Site, Front Page, Blog, Archives, Search, 404, All Singular, or Specific Pages.</li>
<li>Page Exclusions — hide a template on selected pages regardless of include rule.</li>
<li>Sticky Header — make any header sticky on scroll with optional slide animation.</li>
<li>Inline Active Toggle — enable/disable templates without leaving the list.</li>
<li>AJAX Delete — remove templates without a page reload.</li>
<li>Performance First — one DB query per template type per page, per-request memory cache, assets only loaded when a template is active on the current page.</li>
</ul>
<h4>Theme Integration</h4>
Place these hooks in your theme to output templates:
<pre><code><?php do_action( 'aura_hfe_header' ); ?> — in `header.php`
<?php do_action( 'aura_hfe_footer' ); ?> — in `footer.php`
</code></pre>
<h4>For Developers</h4>
Action hooks: <code>aura_hfe_loaded</code>, <code>aura_hfe_activated</code>, <code>aura_hfe_deactivated</code>, <code>aura_hfe_meta_saved</code>, <code>aura_hfe_template_created</code>
Filter hooks: <code>aura_hfe_header_hook</code>, <code>aura_hfe_footer_hook</code>, <code>aura_hfe_resolved_template</code>, <code>aura_hfe_template_matches</code>, <code>aura_hfe_include_rule_options</code>, <code>aura_hfe_evaluate_include_rule</code>, <code>aura_hfe_sticky_offset</code>, <code>aura_hfe_render_post_id</code>, <code>aura_hfe_cpt_args</code>, <code>aura_hfe_active_templates_query</code>
Add a custom display condition:
<pre><code>add_filter( 'aura_hfe_include_rule_options', function( $opts ) {
 $opts['woo_shop'] = __( 'WooCommerce Shop', 'your-domain' );
 return $opts;
} );

add_filter( 'aura_hfe_evaluate_include_rule', function( $result, $rule, $pages ) {
 if ( 'woo_shop' === $rule ) {
 return function_exists( 'is_shop' ) && is_shop();
 }
 return $result;
}, 10, 3 );
</code></pre>

Alternatives to Aura Header Footer for Elementor

Top alternatives