How to make my header sticky on scroll using SKT Golf theme

[nahumpfrancis]

Dear Support,

Will you help me make my header sticky on scroll please? I am suing SKT Golf theme and my website link is https://kevinorieux.com/.

I have used myStickymenu plugin to make it working. However, I prefer some css code so I can learn how it works well and avoid an additional plugin on my website.

Thanks

[nahumpfrancis]

On scroll, the section headings are visible and look weird when I use a plugin so I would like to use some sort of css code to fix this issue.

Please refer to the image.

https://imgur.com/o7YkPqO

[Sonnal S Sinha]

Hi,

Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

.header { z-index:99999999 !important;}

Regards,
Chris

[nahumpfrancis]

Hi Chris,

It doesn’t work somehow. I want my header to be sticky on scroll, please.

Thanks

[Sonnal S Sinha]

Hi,

Kindly use this one

.header { position:fixed !important;}
#slidera { margin-top:65px !important;}

Regards,
Chris

[nahumpfrancis]

Thank you very much Chris,

However, it is having the same issue I had with the plugin. It seems like the home top bar is transparent in most cases.

https://kevinorieux.com/

Thanks

[nahumpfrancis]

https://imgur.com/o7YkPqO

[Sonnal S Sinha]

Hi,

Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

.header { z-index:99999999 !important;}

Regards,
Chris

[nahumpfrancis]

Thanks Chris. It worked. I really appreciate your help!

[Sonnal S Sinha]

Hi nahumpfrancis,

If you found our service good kindly review us here: https://www.sktthemes.org/forums/topic/reviews-and-testimonials/page/22/

Regards,
Chris

[nahumpfrancis]

Hello Chris,

I have noticed one issue when I use this code. My slider wont show proper way if I use sticky header. Can you help me solve the issue please. Thanks.

Please refer the both images. First one without sticky header and second one with sticky header.

without sticky header
https://imgur.com/F2OeFHl

with sticky header
https://imgur.com/jLVlnqh

Please help me fix this!
Thanks

F.Y.I : I have reviewed your theme already, thats why I did not respond to the message.

[Sonnal S Sinha]

Hi,

Kindly use this one

@media screen and (max-width:479px) {
.slider-wrapper { margin-top:80px;}
}

Regards,
Chris

[nahumpfrancis]

Thanks Chris. It worked. I really appreciate your help….

[Sonnal S Sinha]

🙂

[nahumpfrancis]

Hello Chris,

I have tried the above codes on another site and the slider is not showing well. In another words, the slider show gray extra space on the slider below on iPads…

https://imgur.com/OSs9WR2..

Please help me fix this. I tried to play around with the px values and still having the issue…

[Author]

Posts