Return to previous page

Keep top bar visible when scrolling down the page

This topic has 16 replies, 3 voices, and was last updated 8 years, 11 months ago ago by Eva Kemp

theoa

Participant

May 18, 2015 at 19:05

Hi
how can i keep the top bar visible when scrolling down the page and the static menu appears so the top bar is always visible?

the site is currently on localhost so i cannot show you what i mean, but i basically want the top bar to be always visible.

thanks in advance

#64620 Copied

15 Answers
Robert Hall

Support staff

May 18, 2015 at 19:13
Hello,

Please try to add this code in custom.css file
```
.top-bar{
position: fixed;
width: 100%;
}
```
Here is a video tutorial how to create custom.css: https://www.youtube.com/watch?v=Qok2zRedRMY&feature=youtu.be.
Regards,
Robert Hall.
#64621 Copied
theoa

Participant

May 18, 2015 at 20:30

Hi
Thanks for the reply, i tried that previously but the issue is the menu then overlaps the top bar, and when you scroll down the page the fixed menu goes over the top bar.

please advise

thanks again

#64627 Copied

Robert Hall

Support staff

May 18, 2015 at 20:37

Hello,

Please provide us with link to the page and wp-admin access in Private Content.

Regards,
Robert Hall.

#64628 Copied

theoa

Participant

May 18, 2015 at 20:45

hi i’ve just uploaded it adn details are below in private content, thanks

Please, contact administrator
for this information.

#64629 Copied
Robert Hall

Support staff

May 18, 2015 at 21:09
Hello,

I’ve added this code in custom.css file
```
.top-bar{
  position: fixed;
  width: 100%;
  z-index: 100;
}
.navbar {padding: 66px 0px 0px;}
.admin-bar .fixed-header-area.fixed-already {
  top: 92px;
}
```
Please check.

You can try 5/6 1/6 layout.

Regards,
Robert Hall.
#64632 Copied
theoa

Participant

May 18, 2015 at 21:26

thanks, if you scroll down the page on the home page till the fixed menu appears you will see that it covers the top bar now, is there any way that can start below the top bar.

thank you.

#64633 Copied

Robert Hall

Support staff

May 18, 2015 at 21:37

For clarify. Do you want this top bar was placed under the fixed menu?
Maybe provide screenshot for our better understanding and highlight what exactly you want.

Regards,
Robert Hall.

#64634 Copied

theoa

Participant

May 18, 2015 at 21:53

i would like the top bar above the fixed menu always visible, I’ve attached a screenshot link in the private content below, thank you in advance.

Please, contact administrator
for this information.

#64636 Copied

Robert Hall

Support staff

May 19, 2015 at 07:16

Hello,

Please clean cache browser and check it.

Regards,
Robert Hall.

#64664 Copied

theoa

Participant

May 19, 2015 at 10:38

hi
its still not working as the fixed menu goes over the top bar and not below it, i’ve attached another screenshot below to try and make it clearer. the standard menu is fine its just the fixed menu when scrolling down the page.

thanks again.

Please, contact administrator
for this information.

#64710 Copied

Eva Kemp

Support staff

May 19, 2015 at 12:03

Hello,

I’ve checked fixed header and top bar is shown above fixed header too.
Please try to check in another browser.

Thank you.
Regards,
Eva Kemp.

#64722 Copied

theoa

Participant

May 19, 2015 at 16:34

Hi Eva

Which browser are you using?

I’ve been using firefox but have also just checked on chrome and it doesnt show. Although on chrome i have noticed the menu bar for fixed menu doesnt get smaller like it does on firefox.

if you are on the home page and scroll down to the bottom do you still see the top bar and also the menu bar visible?

thanks again

#64809 Copied

Eva Kemp

Support staff

May 19, 2015 at 16:44

Hello,

When I scroll the page I see top bar and fixed header.
Please take a look at the screenshot:
https://s3.amazonaws.com/fvd-data/notes/168674/1432050204-iO4Vn1/screen.jpeg

Thank you.
Regards,
Eva Kemp.

#64811 Copied

theoa

Participant

May 19, 2015 at 16:45

ok not to worry i set the fixed menu to show 60px lower and its fine now. 🙂

thanks so much for the help.

#64812 Copied

Eva Kemp

Support staff

May 19, 2015 at 17:03

Hello,

You’re welcome.

Regards,
Eva Kemp.

#64815 Copied
Viewing 16 results - 1 through 16 (of 16 total)

The issue related to '‘keep top bar visible when scrolling down the page’' has been successfully resolved, and the topic is now closed for further responses

Keep top bar visible when scrolling down the page

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection