Search return page pulling wrong header

[Raychill]

Hi there,

I’m using 3 headers

1. For pages (each individually selected to pull this header) = Absolute positioning
2. One for “global” (which includes posts) = Relative positioning
3. One for a couple of special landing pages = Absolute positioning

When I make a search, if it does return results, the header that is individually marked for pages is being returned (#1). The issue is that it’s absolute positioned, so the navigation is over-top of the results.

However, if there are no results, the correct Global header (#2) appears

Why is the “Global” header not being returned in the /?s= page? And/or why is it appearing as one header if there are results, and another header if there are no results?

I already tried clearing my browser cache and the website cache.

Thanks a bunch

[nabeel]

Hi @RachelDi,

Thank you for reaching out to us. If you assign a Header to a page, it gets higher priority over the Global Header, now when you’re searching something and if your keyword exists in a page where you’ve assigned a Header specifically (e.g Absolute positioned) this assigned header will show up instead of Global Header because of the higher priority.

Hope this helps!

[Raychill]

As a user, intuitively I’d expect the global header to apply to a search return.

But since that’s not the case, how can I adjust the search return to put a margin at the top of its page to push the results down so the header doesn’t cover up the first couple of returned items?

I’m assuming the options are to modify the php or apply some css. If php is recommended, can you let me know what php file to modify (and where abouts it is), or if css is the easiest way (I prefer that method) can you let me know the correct class to apply for the css that only applies to the search return page when there are results?

Thanks so much!

[nabeel]

Hey @RachelDi,

CSS would be the easiest solution here, you can use the following selector .search-results .x-container>.offset to give the margin-top on the results page only e.g you can use the following code:

.search-results .x-container>.offset {
    margin-top: 100px; /*adjust this value with the actual height of the header */
}

Please note that the code provided above serves as a guide only and is to help you in getting started so implementing it and maintaining the code will be out of our support scope and for further maintenance for new possible versions of the theme that may cause the customization to break, you will need to hire a developer.

Hope this helps!