How to get a menu where the menu is right next to the logo on the left hand side

Hi there,

you can use the navigation as a header:

https://docs.generatepress.com/article/navigation-as-a-header/

Then you can set the Primary Navigation to align left.

Brilliant. It works. Thank you. The problem I have now is the search button it all the way on the right of the screen

http://prntscr.com/n2q5sm

Try this CSS:

.main-navigation li.search-item {
    float: left !important;
}

Cheers, that worked David, however now when I hover over the menu everything goes black...

http://prntscr.com/n31ec4

Can you provide a link to the site so i can take a look? You can edit your original topic and use the Site URL field for privacy.

It's on a test site at the min.

I made a video though...

https://www.useloom.com/share/50a9390d4d3c471a9951a044aba4bd52

Sorry my bad, gave you the wrong float - so edited the code above.
Hmmm... nice effect created by a bad code lol - its doable but not simple. So effectively make it a negative effect ?

Trying to think how we would invert the logo... hmmm

Hi David,

I got lost with replies to this.

Any thoughts on how to accomplish this? To make the logo appear a different colour on hover? Also, the menu background goes white on hover but the text is also white so appears blank.

Any help would be greatly appreciated :)

The menu color swap wouldn't be too difficult, changing the logo color will be trickier. The solution for that would be to use an SVG:

https://docs.generatepress.com/article/adding-svg-logo/

We can then swap the fill color ( maybe ).

Is that doable? Then we can look at the CSS required. Would need a link to the site.

Let me look into that David.

Again, thanks for being so responsive!

You're welcome - let us know when you're ready.

Hi David,

Sorry, i have been mad busy and haven't had a lot of time. There is no SVG logo - can I generate one from a jpeg or png using an online converter of some kind? (I have never done this before).

With thanks,

Andrew

You can do conversion from JPEG/PNG to SVG but unless you have a really high res logo and pay for a good service the results can be rather poor. They are best created using a package like Adobe Illustrator or Affinity Designer......

I will ask the owner of the company if they can have an SVG created. Maybe their original logo designer can get one for them.

Again, I appreciate your assistance with this!

(how do I add log in details on this post for you to access the site in question?)

Thanks David!