Extra space above header

Hi there,

instead of adding the background image in the site header you could hook it in below the site header. That way you can add your logo into the site header.

1. Customizer > Backgrounds > Site Header remove the background image.
2. Customizer > Site Identity add your Logo
3. Customizer > Layout > Header adjust your top and bottom padding eg. 20px

4. In Appearance > GeneratePress activate the Elements module.

5. In Appearance > Elements --> Add New --> Hook Element.
In the text are add this HTML:

<div class="grid-container custom-header"><img src="https://travelingturks.com/wp-content/uploads/travelingturks-header-1.jpg"></div>

Make sure the src url is correct.

5.1 Set the Hook to: generate_after_header
5.2 Set the Display Rules to: Entire Site

And that should do it

David thanks a lot, yes it was worked your suggestion but I have 2 more struggle and unfortunately couldnt solve it by myself; on mobile I need to locate the togle on the mid, search bar on the right and logo on the left but I can not move the components in this order. And the logo size for the mobile is too big. I hope there is a way, many many thanks for your support. My website is https://travelingturks.com/

Can you open a new topic for the new question?

I'll mark this one resolved.

Thanks!

sure, thanks

Thank you!

Hello again, unfortunately now I recognized that it is not applied in all pages although I choosed the "entire site" option. In some pages the menu is below and in soma pages the header image is not visible. I give you the samples below;

This is the one I want; https://travelingturks.com/avrupa/ispanya/barselona
These pages are wrong; https://travelingturks.com/en/tickets/burj-khalifa-tickets https://travelingturks.com/en/europe/turkey-en/dentist-prices-in-turkey

Thanks a lot,

YSipahi

Change the Hook to generate_inside_container and clear any caches.

Davis thanks a lot for recommendation and I did as you said, cleaned the web browsers and puched cache in wp admin and purgec cache in the server. But still problem goes on; I have some pages the menu bar is at the top and some of them below the header, same in the mobile. And I have the following issues as well, just two of them I recognized.

https://travelingturks.com/es/europa/espana/barcelona
(pls see this on mobile); https://travelingturks.com/en/europa/spain/barcelona-en/the-best-flamenco-show

Thank you,

YSipahi

Now add this CSS to your site:

.site-content {
    flex-wrap: wrap;
}

Yes it worked, but this page still not good, thanks

https://travelingturks.com/en

sorry that page is also ok now

Glad to hear that !

Thanks you, and can we explain why there is no any visible menu on mobile homepage "travelingturks.com" while it above or below the header in other pages?

Probably the same issue you had here?

https://generatepress.com/forums/topic/home-page-is-black-and-menu-is-not-visible-on-mobile/#post-2460323