[Resolved] logo position and transparent menu

[Moses]

I guess I must be missing something as this seems very simple but I just can’t find it

I want to create my homepage with Elementor, but I want to display the Theme’s menu and logo
I want them to have transparent background (so they would “sit on” the top section I designed in elementor)

And I want the logo to be on the left, and the right (same level)
The site is RTL so by default the logo is set to the right – where do I control it?

Thank you very much!

**Edit:
I thought I wasn’t clear enough, I don’t want to use the GeneratePress header function, but only to make the header section completely transparent – so that it would sit right on the first element I create with the page builder

[Leo]

Hi there,

You can use the header alignment to change the position of logo: https://docs.generatepress.com/article/header-layout/#header-alignment

And sounds like you are looking for the merging option: https://docs.generatepress.com/article/merging-header-navigation-content/

Let me know.

[Moses]

for some reason I can’t find these header options
all I can find there are two options:

Page Header Location
Single Post Header Location

and thanks for the page merging reference! it works perfectly

[Leo]

Should be in Customize > Layout > Header.

[Moses]

OK found it thanks!
though only two of the options fork for me,
the site is RTL and I can only make the logo appear on the right or centered

[Leo]

Can you link me to the site? We can try some CSS solution.

[Moses]

Sure
http://yaeligor.com
header alignment is set to left
and main menu to the right.
I want the logo to be all the way to the left, not just left to the menu

[Leo]

Can you first try setting the navigation to float right and see if it works?

If not try this CSS:

.site-logo {
    float: left;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

[Tom]

This is an RTL issue fixed in the next GP version.

For now you can do this:

.header-aligned-left .site-header {
    text-align: left;
}

[Moses]

Thank you both Leo and Tom!
Glad to hear this is being fixed!

[Leo]

Glad we could help!

[Moses]

another small things related – maybe that’s something that need’s a fix as well or it’s just me who doesn’t get it
http://yaeligor.com

1. The search and cart icons jump to the right on the sticky menu (I want them to stay in the same place)
2.The logo isn’t vertically centred to the main navigation (while the logo is perfectly cropped)

[Leo]

1. I’ll ask Tom to have a look 🙂

2. You can either set the height to be the same as the logo height: https://docs.generatepress.com/article/menu-item-height-width/

Or use this method to achieve the layout: https://docs.generatepress.com/article/navigation-logo/#navigation-as-header

[Tom]

Try adding this for #1:

.rtl.nav-float-right .is_stuck.main-navigation .menu>li.search-item, 
.rtl.nav-float-right .is_stuck.main-navigation .menu>li.slideout-toggle, 
.rtl.nav-float-right .is_stuck.main-navigation .menu>li.wc-menu-item {
    float:none;
    display: inline-block;
}

[Moses]

Thank you both! it works perfectly.
You support is the best i’ve ever witnessed. Glad I choose GPP

[Author]

Posts