How To Edit Headers And Footers In Elementor (Free)

Blog Inbox
3 min readJan 7, 2022

--

Editing header and footers in Elementor usually requires the Elementor Pro plugin but there is also a free way to do this with a plugin called Elementor Header & Footer Builder. To get started with it you first need to add the plugin to your plugin library.

Table of Contents

Setting up Elementor Header & Footer Builder

To set up Elementor Header & Footer Builder head on to Plugins > Add new and search for Elementor Header & Footer Builder.

After installing and activating the plugin you can head on to the Appearance > Elementor Header & Footer Builder to find the plugin and to get started.

Creating a new header

Now that we are in the plugin you should see an empty list unless you already have created a header or a footer earlier on or if your theme has created one through starter templates. To get started you can simply click on Add New at the top of the list to start creating a new header.

A few important settings to place on the first page before moving on to building your header with Elementor is to set up are

  • Type of Template — Header
  • Display On — Entire website
  • User Roles — All

This is to ensure the plugin knows that you are building a header, you want it to be shown on the entire website, and that it should show for everyone. Though you can change each of these settings to your needs and even create headers that are only shown to logged-in users, certain user roles, or only on certain pages.

After setting up the main settings press the “Edit with Elementor” button to head on and edit the header. Editing the header will be the same as you would edit a normal Elementor page.

In our example, we have created a header with a custom logo, menu and set a bottom border for the area. If we would load the full page now it would show us the header in place.

Creating a new footer

To create a footer we go through the same steps as before but now we choose the Type of Template — Footer to tell the plugin we are building a footer.

You can even test this out quickly by simply changing your Header to Footer in the settings to see how it looks. A quick note regarding the editing is that it will still show on top of the page when you are editing it, but it will be placed as a normal footer on the bottom of the page.

Conclusion

Creating and editing headers and footers with this free plugin is extremely simple and effective. The best part is that if you’re familiar with Elementor you are able to create your dream headers and footers almost instantly and even create multiple different ones depending on different rule sets.

Disclosure: In compliance with the FTC guidelines, please assume the following links: Any/all of the links on this post are affiliate links from which we receive a small compensation from sales of certain items.

Prices are exactly the same for you if your purchase is through an affiliate link or a non-affiliate link. You will not pay more by clicking through to the link.

--

--