WordPress › Support » Floating Menu Bar & Adding a Logo to Menu

amn1710
Member
Posted 1 year ago #

Hello everyone... This is two part question:

1) How do I add a logo to the actual menu bar (and not above it as part of the footer)?

2) How do I make said menu bar float / sticky?

I did some searching / browsing on here and was not able to find an answer that actually works.

Background info: I'm a novice when it comes to coding so if there's a plugin that does that for me, I'll take it!

Thank you in advance for your help!!!
CrouchingBruin
Member
Posted 1 year ago #
1) How big do you want to make the image, the same size as the menu bar or bigger? If you want to make it the same size, you could possibly make it the background of the menu bar using some simple CSS. If you want to make it larger, or if you have some special positioning within the menu bar, you'll probably need to create a child theme.

2) Fixing the menu at the top of the browser window is fairly easy, you just set a couple of CSS properties. If you don't want to create a child theme, you can use a CSS plugin like Lazyest Stylesheet or Custom CSS Manager. Then add this CSS to the plugin's custom CSS field:
```
#navbar {
   position: fixed;
   top: 0px;
}
```
You would probably add a top margin to the page element, though, so the top part of the menu isn't hidden.
southlandsft
Member
Posted 3 months ago #

I have a similar issue-and perhaps this issue does not belong here but trying to get my logo to float above and on top of the menu bar if at all possible-right now it resides below it which cause some things to change in the layout... any help appreciated southlandsft.com
CrouchingBruin
Member
Posted 3 months ago #
Hi, southlandsft. You can add this rule to your custom CSS:
```
#top-header {
   clear: both;
}
```
You'll probably want the logo to go all the way to the top. The widget area in the header is keeping it from going all the way up, though, so you can fix it with this rule:
```
#widget-header {
   float: right;
}
```
ycon
Member
Posted 3 months ago #

I also need help with this. I used the Custom CSS Manager

My menu is sticky using:
#navbar {
position: fixed;
width: 100%;
z-index: 1000;
}

I want to put a logo in the menu bar on the top left- but it won't work. My CSS Knowledge is minimal so please assist.
Andrew
Forum moderator
Posted 3 months ago #

http://wordpress.org/support/theme/twentythirteen#postform