I’ve been playing around with this since Newspaper and never was able to get it quite right.
I’ve got a bar I need to add to the top of the site for sponsors and such. It’s full width and 60px tall. The problem I keep running into is wherever I add the bar (Theme panel under custom javascript, or in the header file inside the main wrapper or before it), it shows up but breaks some part of the layout.
Is there a place to add this bar that won’t break the layout around the admin bar and sticky header menu? I can deal with some goofy space when the admin bar shows up, but the sticky menu disappears behind the top bar because it’s still going to the top of the browser window.
Thanks.
Hi,
You should add it above the top-menu container – http://screencast.com/t/K8nQEltCnCTP
Please provide some details on the code/css you used, maybe a copy of it via pastebin – http://pastebin.com/
Thank you, Emil G.
Yep, here’s the code – http://pastebin.com/nDRpQgHg
All javascript, loads a lot like an ad. Trying it out where you suggested on header style 4 now. Will let you know how it works.
Hi,
Please use this custom css: http://screencast.com/t/GXij7S2xijYf – http://screencast.com/t/9iaB9bp4 – http://screencast.com/t/F5P26hYkx7H
.td-header-main-menu.td-affix {
top: 60px;
}
.admin-bar .sbNavIframe {
top: 32px;
}
.admin-bar .td-header-main-menu.td-affix {
top: 92px;
}
@media screen and (max-width: 600px){
#wpadminbar {
position: fixed;
}
}
Also on mobile view: http://screencast.com/t/JnxB7M8u – http://screencast.com/t/O2oRyw0gOfxN
Maybe you will have to use !important
Thanks!
That’s awesome, Alin. Thanks! I’ll give it a try this afternoon and post the results back here.
Works perfectly. Thank you very much for helping with that custom bit. Much appreciated.
