Banner covering top menu

Hi @clelland1982
It looks like you have the banner activated but neither the CSS or Javascript file associated with the banner is showing. That usually means you have another plugin bundling all of the js and css for your site together. This often interrupts the banner from showing. If you disable that feature or exclude simple-banner.js from the bundling then everything should work.

Hi Ryan, thanks for coming back to me.

I think you might be misunderstanding me. I can get the banner to show fine. The problem is, it covers the menu bar at the top of my homepage. Can your banner not push the top of my website down a little, so it sits above the navigation?

I have removed your banner from displaying on my site (by simply deleting the text in the text box), just until I manage to get it working without covering up the top navigation.

Thanks

Gotcha. Its difficult for me to find a solution without the banner displayed. If you can activate it for a short while i should be able to figure something out for you.

That’s it activated. Thanks

Hello Ryan,

Sorry to jump on this tread.

I am having a similar issue with out banner it is covering our menu options and im new to wordpress and no idea how to fix this. and being a charity i also dont have access to the pro features either can you maybe help assist

our webiste https://www.cheshireyoungcarers.org

josh

• This reply was modified 4 years, 8 months ago by cycjosh.

Hi @cycjosh pleas open a new thread for your support issue.

@clelland1982 I’m still not seeing it on the page, do you possible have a plugin that is caching everything for your site? You may need to clear that in order for it to be truly active on the site.

Hi Ryan, I had to purge the cache. It should be showing now. Sorry

@clelland1982 in Custom Site CSS:

@media only screen and (min-width: 801px) {
    .fusion-header-wrapper .fusion-header {
        margin-top: 46px;
    }
    .slide-content-container.slide-content-left {
        margin-top: 46px;
    }
}

Hi Ryan,

It’s better but it’s still covering my upper menu bar that sits right at the top of my homepage. The upper menu bar has got contact buttons on it, etc

Hi Ryan,

Just noticed it’s also completely covering the top navigation on mobile.

So to be clear, your bar is covering my small upper navigation bar on desktop and also the whole navigation on mobile.

I hope you can come up with a fix. Thanks in advance.
David

Add to Custom Site CSS:

@media only screen and (max-width: 800px) {
    .fusion-header-wrapper .fusion-header {
        margin-top: 56px;
    }
}

Hi Ryan,

Thanks but this code didn’t work out well at all as you will see.

I removed the first piece of code you sent me and replaced it with the above.

Banner now covers half the logo on both desktop and mobile.

Thanks in advance

Don’t remove, add both as i stated in the previous response.

• This reply was modified 4 years, 8 months ago by rpetersen29.

So you Custom Site CSS will be:

@media only screen and (min-width: 801px) {
    .fusion-header-wrapper .fusion-header {
        margin-top: 46px;
    }
    .slide-content-container.slide-content-left {
        margin-top: 46px;
    }
}
@media only screen and (max-width: 800px) {
    .fusion-header-wrapper .fusion-header {
        margin-top: 56px;
    }
}

Adjust those margin values as you see fit.

Hi Ryan,

Sorry for having to come back to you again.

Had a play around with the values. Managed to get it looking better on mobile (bottom value done this I presume).

But I’ve adjusted all 3 margin values (the 46,46 and 56 above), and whatever I do I cannot stop it covering the small bar at the top of my homepage. It’s covering this bar on both desktop and mobile. This bar contains the shopping cart and contact link, so it’s essential.