Special Offer: Buy All 48 Premium WordPress Themes for Just $74.99. Learn more

How to disable fixed header

Some of our themes comes with fixed header (it doesn’t change its position when you scroll). In case that you want to disable it, here are all of the necessary steps:

1) Open style.css

Then search for ‘#header-main-fixed’ class and DELETE ‘position:fixed;’ from it, i.e.

Before:

/* header */
#header-main-fixed {
clear:both;
background-color:#FFFFFF;
margin:0;
position:fixed;
width:100%;
z-index:5000;
color:#000000;
-webkit-box-shadow: 0 4px 2px -2px gray;
-moz-box-shadow: 0 4px 2px -2px gray;
box-shadow: 0 4px 2px -2px gray;
}

After:

/* header */
#header-main-fixed {
clear:both;
background-color:#FFFFFF;
margin:0;
width:100%;
z-index:5000;
color:#000000;
-webkit-box-shadow: 0 4px 2px -2px gray;
-moz-box-shadow: 0 4px 2px -2px gray;
box-shadow: 0 4px 2px -2px gray;
}

Save changes and upload the style.css file.

 

 

2) Open themefolder/js/utilities.js file

Then find and DELETE this code:

jQuery(‘#header-spacer’).height(jQuery(‘#header-main-fixed’).height());

Save changes and upload the utilities.js file.

 

 

3) Open header.php file

Then find and DELETE this code:

<div id=”header-spacer”>
&nbsp;
</div>

Save changes and upload the header.php file.

 

About the Author

Tihomir Ivanov is a WordPress web developer, founder of tishonator.com, a fan of Linux and Open Source, a gym enthusiast, a vegan, a fan of minimalism, good movies and books :)

2 Responses to “How to disable fixed header”

Leave a Reply