[Support request] Navigation on the right, logo on the left

[mkjj]

I would like to have the logo on the left, and the navigation elements on the right (above the page hero). It seeems like a pretty easy task, but I can’t get it to work. I’ve created an header element for a fullwidth image, and set “navigation location” to “above header”. Header width is set to contained. However, it simply doesn’t work. The header DIV uses all the space, so that the the logo is always below the navigation: https://temp.herrenhof.net/

Could you point me in the right direction?

Thanks, Mike

[Ying]

Hi Mike,

Go to customizer > layout > primary navigation, choose float right for the navigation location.

[mkjj]

Hi Ying,

this is exactly my setting, but it does not work. I know that this is not a GP issue but me being thick as a brick. 🙂

I’ve just found out that it works when the header element is disabled.

Thanks, Mike

[Ying]

I’ve just found out that it works when the header element is disabled.

Hum, can you go to the header element and check what’s the settings for Navigation Location?

[Lucie]

I have exactly the same issue: would like navigation on right, logo on left. I have clicked ‘use navigation as header’. With browser Inspector, can see that the logo is specified, and is valid file. For mobile, it works. Does enabling mobile disable desktop logo?

See img below.

THanks in advance

[Ying]

Hi Lucie,

Can you check the header element, have you selected anything in the navigation location field?

Let me know 🙂

[Lucie]

Ying, not sure exactly what to check. Are you asking if I created an Element that is appearing on frontpage? No.
Or something else? If you specify (sorry not a GP expert) exactly where to look, that would help.
Here are my settings for “Customizing/Layout/Header” in case that helps.

[Ying]

Go to appearance > elements, check if there’s a header element.

If so, edit the header element, set the navigation location (under site header tab) to Default.

Let me know if there’s anything unclear 🙂

[mkjj]

I had to change the navigation to full width and add this CSS to my child stylesheet:

.inside-navigation {
  max-width: 1200px;
  margin: auto;
}

I’m still not quite sure what “navigation as header” means. Could you please explain this in more detail?

[Ying]

Hi Mike,

I updated the reply here, can you check? Thanks!
https://generatepress.com/forums/topic/navigation-on-the-right-logo-on-the-left/#post-2221473

[Lucie]

Ying, I went to appearance > elements, there’s a header element but nothing attached to frontpage (I set exclusions to Entire Site) which should be equivalent to no headers at all, correct?

[Ying]

Ying, I went to appearance > elements, there’s a header element but nothing attached to frontpage (I set exclusions to Entire Site) which should be equivalent to no headers at all, correct?

I can still see the header element is taking place on your homepage, it’s using the mergefeature.

If there’s a display rule set, excluding entire site may not work.
You can try set the header element to draft and clear cache or disable your cache plugin for now.

Let me know how it goes.

[mkjj]

Hi Ying,

sorry for all the confusion. I’m pretty slow today, I guess. In the header element the navigation was set to “above the header” from the very beginning. “Navigation as header” did the trick. I’ve just found out that my additional CSS is not necessary. I just had to set the inside width of the navigation to contained. I still don’t really understand what “navigation as header” means. Anyway, now I know how to use it. 🙂

Thanks, Mike

[Lucie]

Hi Ying, thanks. I trashed the frontpage element (that was previously set to excluding entire site) and changed the published setting to draft for the only other element that might be header related. Can you check to see if they are still in play? I reloaded page, but still can’t see the logo.
Thanks again.

[Ying]

in the header element the navigation was set to “above the header” from the very beginning.

Yes, that’s overriding the customizer option to set the navigation to float right.

I would suggest set the navigation location to defaultin the header element, so the customizer settings can take place.

Navigation as header option removes the default header, instead it adds the site branding(logo, site title, etc.) to the navigation.

[Author]

Posts