Skip to content

Custom Header & Footer with Elementor

Since v3.18.0, you can create your own custom headers and footers for you website using the free version of Elementor.

How to make Elementor Header Sticky?

First, please make a copy of your existing Custom Elementor Header, and make any necessary changes to as per your liking. It is very important to note here that you can't use the same header as sticky, otherwise you will experience style and layout related issues

Once you have made satisfactory changes, navigate to Dashboard → Real Homes → Customize Settings → Header and Enable the settings "Sticky Header" and select the Sticky Header you have just created.

RealHomes Sticky Elementor Header

How to import Custom Headers & Footers?

The custom headers and footers JSON files are located in the theme package [ rh-main-package.zip ]. Upon extraction, you can find them at the rh-main-package → Elementor Templates, and in this directory, you can check Headers and Footers folder.

Custom Headers and Footers JSON

Follow the steps below to import.

  1. Navigate to Dashboard → Templates → Saved Templates.
  2. Click on Import Templates and then select any JSON file for the Header or Footer to import.
  3. Once the Elementor template is imported, edit the home page or the relevant page with Elementor and follow this quick video demonstration.