Hey there! Some links on this page are affiliate links which means that, if you choose to make a purchase, I may earn a small commission at no extra cost to you. I greatly appreciate your support!

How To Make Sticky Header in GeneratePress Theme

If you have just purchased the GeneratePress premium theme then you must want to make a Sticky header in GeneratePress.

To Enable GeneratePress sticky header just go to your WordPress Customizer and Follow all these steps one by one.

A sticky header is a common design element in WordPress themes. It typically remains fixed to the top of the screen while scrolling, and it may or may not be transparent depending on what design you like best.

Head over to Layout>and Click on Sticky Navigation Option

layout>sticky navigation generatepress
layout>sticky navigation generatepress

After that, you have to turn on the sticky navigation. If you want to turn it on for mobile or desktop.

 GeneratePress sticky navigation
GeneratePress sticky navigation

Turn on the sticky navigation for specific Device. And after enabling this just publish your changes and scroll down.

If you want to remove the  padding around the logo on mobile:

.mobile-header-navigation .mobile-header-logo img {
    padding: 2px;
}

For Navigation Only

If you want the standard Site Header to be Sticky then this CSS will do the trick:

.site-header {
    position: sticky;
    position: -webkit-sticky;
    top: 0;
}

GeneratePress Sticky Header

Now after enabling this sticky header in GeneratePress you will be able to scroll the header along with content.

You can also use your navigation as a header and make it sticky with your website logo. To do so simply go to the Layout section again and find the header option.

Use Naviagation as a Header in GeneratePress

Check this box and simply select your logo for mobile or desktop both versions if you want too.

Now you can use this feature GeneratePress sticky header on your website. If this guide helped you then please feel free to ask anything in the comment down below. I will be happy to help you.

If you are still unable to do anything with GeneratePress sticky header then please visit GP docs here.

Syed Saadullah

I am Saad. I run this blog and work for Syntax Software House. I build Super fast WordPress sites. Do you have a question in mind?connect with me at Twitter

Leave a Comment