Add support to Header Footer Elementor from the Child Theme

If your current theme is not supported by Header Footer Elementor, It is still recommended to contact your theme developer and see if they can add theme support from the theme. Just refer them the Developer Article they can follow to add support for the plugin.

If for some reason this is not possible you can follow along with this article to add support for Header Footer Elementor by yourself from the child theme.

In this example, I will explain adding support for the TwentySeventeen WordPress theme.

Make sure you make this changes in the child theme if you will be getting updates to your theme in future. Else a theme update will remove all the changes that you make.

Add Custom Header Support

1. Copy the header.php from your parent theme to your child theme, This will you will be overriding the header from your child theme.

2. The Header Footer Elementor Plugin provides the content in <header> tag for your website, So we will add conditions around the <header> in the header.php to check if the header is enabled from the plugin.

Just before the opening <header> tag in header add the condition to from the plugin to render its header -

<?php if ( function_exists( 'hfe_header_enabled' ) && true == hfe_header_enabled() ): ?>
	<?php echo hfe_render_header(); ?>
<?php else: ?>

3. Just after the </header> tag add the closing if condition -

<?php endif; ?>

Here is the modified header.php looks like for twenty seventeen theme - header.php

Add Custom Footer Support

1. Just like the header.php copy the footer.php from the parent theme to the child theme.

2. The process is exactly similar for the footer. The Header Footer Elementor Plugin provides the content inside <footer> tag for your website, So we will add conditions around the <footer> in the footer.php to check if the header is enabled from the plugin.

Just before the opening <footer> tag in header add the condition to from the plugin to render its footer -

<?php if ( function_exists( 'hfe_footer_enabled' ) && true == hfe_footer_enabled() ): ?>
	<?php echo hfe_render_footer(); ?>
<?php else: ?>

3. Just after the </footer> tag add the closing if condition -

<?php endif; ?>

Here is the how the modified footer.php looks like after you modify it - footer.php

Removing the Unsupported theme warning from the Admin

1. Now that the header and footer are supported you can disable the warning in the backend by adding theme support from your functions.php file in the child theme.

function twentyseventeen_header_footer_elementor_support() {
	add_theme_support( 'header-footer-elementor' );
}

add_action( 'after_setup_theme', 'twentyseventeen_header_footer_elementor_support' );