How To Create Header And Footer Using Elementor For FREE

Do you want to create a professional header and footer for your website using the free version of Elementor?

In this tutorial, I will show you How To Create Header And Footer Using Elementor For FREE in just a few clicks.

Elementor is a visual page builder that offers a “Drag and Drop” feature that allows you to easily create custom layouts for WordPress without any coding knowledge.

Learn More About Elementor Free vs Pro

First of all, let’s have a brief introduction about what is header and footer?

What is Header on a website?

Basically, the top of your web page is called the website header. The title is usually the same throughout your website. Your header design will provide your users with their first impression of your website.

The website header also helps promote your company’s brand identity. site navigation, site search, shopping cart (for eCommerce sites), call-to-action (CTA) buttons, and other features that improve user experience and increase conversion rates are all found in headers.

Your footer layout design can display useful and vital information such as newsletter signup, copyright information, terms of use and privacy, sitemap, contact information, maps, website navigation, and much more, depending on the settings you choose.
Your footer layout design can display useful and vital information such as newsletter signup, copyright information, terms of use and privacy, sitemap, contact information, maps, website navigation, and much more, depending on the settings you choose.

1. Install and activate elementor plugin

First of all, you need to install and activate the Elementor page builder plugin (if you haven’t already installed it) that allows you to edit your web pages easily.

Navigate to your WordPress dashboard hover on plugins -> add new plugin in search type Elementor

Wordpress web development vahid sediqi
How To Create Header And Footer Using Elementor For FREE

A quick reminder, the Elementor header footer builder module comes with Elementor Pro, but in this tutorial, we are using ElementsKit which is an Elementor addon plugin that easily allows us to create a beautiful header and footer in just a minute.

2. Install and Activate ElementsKit addons for Elementor

ElementsKit is an ultimate addon for Elementor Page Builder. It includes the most comprehensive modules, such as Header Footer Builder, Mega Menu Builder, Layout Library,

Elements kit Elementor Addon has Exclusive features Like Mega Menu Builder, Header and Footer Builder layout library, One Page Scroll, Sticky Content, Parallax Effects.

Go to plugins -> add new plugin and in search type ElementsKit Lite

Wordpress web development vahid sediqi
ElementsKit Lite

You can see this plugin has more than 500,000 active installations with more than 800 5 star reviews, so we can trust that it is a save plugin that won’t hurt our website. now we are ready to create our header and footer using Elementor

Wordpress web development vahid sediqi

After installing ElementsKit Lite hover over it and click on ElementsKit and then click on WIDGETS to activate Header and Footer Wedgits

Wordpress web development vahid sediqi

After clicking on Wedgits you will see lots of cool widgets that this plugin offers for Elementor you can enable or disable any of these according to your need, scroll down until you see header and footer then enable these features shown in the image below

Wordpress web development vahid sediqi

Now you are ready to create your amazing header and footer using Elementor

Go to ElementsKit and click on Header and Footer, click on add new

Wordpress web development vahid sediqi

You will see the template settings, go as follows;

  1. Title: give a name for your template
  2. Type: select the template type wither it is header or footer
  3. Conditions: Select Eniter site
  4. Activate/Deactivate: you can turn off or on you header and footer template
  5. Next click on Edit Content to start editing
Wordpress web development vahid sediqi

Now you are in the Elementor editor dashboard you can import a free Header/Footer template offered by ElementsKit or you can create your own template

To import a free ready-made header template follow the steps below

  1. Click on ElementsKit icon
  2. On top click on sections
  3. Select you template and click insert
Wordpress web development vahid sediqi

ElementsKit has made the job of every WordPress website owner easier, as adding headers and footers makes a website more organized and refined. It also not only enhances users’ experience but also improves web traffic.

If you have any questions regarding the ElementsKit header footer, please leave a comment below.


If you liked this article, you will definitely find more helpful tips and blogs by joining, please don’t forget to share this article with friends

Read our article What is Metaverse

5/5 - (1 Reviews )
Share your love
Default image

Vahid Sediqi

Vahid Sediqi is a WordPress and web designing expert, content creator and blogger that helps you to define the right goals for your website and make it become digitally successful with the existing or newly created website.

Articles: 34

Leave a Reply

Your email address will not be published.