Make Sticky Header with the Free Elementor

Do you want to make sticky header with the free version of elementor?

Free version of the Elementor plugin restricts us to make a page with sticky header. There are many free templates and themes, exclusively for Elementor that provides inbuilt sticky header feature. You can either go for them.

There are many plugins which can do the job, but extra plugins can make your site load slower too. Some themes do provide sticky header and even using some CSS you can make sticky header

If you have decided to make your own template or use template without sticky header feature, here’s how you can make sticky header with the free Elementor.

1. Make Sticky Header with Free Elementor Using Plugin

There are plugins for everything in WordPress. There is a popular plugin mystickmenu to make your website header stick with the free Elementor.

The plugin is free and easy to use.

Download it from WordPress plugin directory

2. Make Sticky Header with Free Elementor Using Theme Customizer

If you’re little friendly with coding, you can use the below code.  Find the header id or class and add this CSS to theme customizer.

#id{
position:sticky!important;
top:0
} 

Note– If it’s a class, use .classname , if id , then #id

If  you want to find id or class of your theme’s header, you should use a chrome plugin called Stylebot. That will help you a lot in changing the theme HTML and CSS properties.

3. Make Sticky Header Using Elementor Pro

Sticky header features is included in Elementor pro, just upgrade it.  With Elementor pro, you can build seamless pages without caring for extra plugins and coding.

Hope this helped you make a sticky header with free version of Elementor.

Some other helpful articles:

[5-Min Fix] 500 Internal Server Error in WordPress

How to add Ping List to WordPress Website for Faster Indexing

How to Deactivate all WordPress Plugins (When No Access to WP-Admin)