Search results hidden behind header sticky on results page
Author: Wayne G.
Visited 1354,
Followers 1,
Shared 0
On our test website if you type something into the search bar the following search result on the following page is hidden behind the sticky header.
http://elthamseascouts.org.au/2020test2/index.html
we have tried all the different settings like turning header back on in template settings etc...
There needs to be a margin at the top of the search results page.
Screen shot included
Posted on the
Hello Wayne
You cannot edit the search page BUT you can edit the settings for the search page.
In settings for the page
You make some styling in the expert tab. Before Closing the head-tag you insert :
<style>
#imStickyBarGraphics {
visibility: hidden;
overflow: hidden;
}
#imStickyBar {
visibility: hidden;
overflow: hidden;
}
</style>
This will hide the sticky header on the search page.
Author
yes this works - not perfect but an acceptable workaround till it is fixed properly - would still love to have the sticky showing.
Thank you so much John!!!
Author
the reason I cannot close this or mark it as fixed is because the search function stops working on the search page. Also the top result is not clickable on the top part of the result. Only the bottom link.
Almost so perfect. LOL
Hello Wayne,
I've marked your posts for the specific attention of the Incomedia support team.
You should receive a reply soon (usually within 24-72 hours).
Kind regards,
Paul
Search the WebSite X5 Help Center
Hello Wayne
Could you then try this :
<style>
#imStickyBarGraphics {
display: none;
overflow: hidden;
}
#imStickyBar {
display: none;
overflow: hidden;
}
</style>
Forget it - I think is the container for the sticky bar we have to get rid of.
Hope to find a better solution.
Hello Wayne
I had some trouble removing the container - instead I brought the search page in front of the container so the search field is editable and the top results is also clickable. I hope it can be used.
Try this :
<style>
#imStickyBarGraphics {
display: none;
overflow: hidden;
}
#imStickyBar {
display: none;
overflow: hidden;
}
#imSearchPage {
z-index : 15000;
}
</style>
Author
wow, that is some wizard skills you have there. Yes works perfectly - except loose my sticky but a small price to pay for having a functioning search bar for Sunday's launch of the new scouting website. Thank you so much, John!!!
I maybe could make it another way.
I will try something else - stay tuned
It seem that you don't use a header and then the search page will go all the way up to the top. And then the sticky bar covers the top of the search page. I solved this by making the content of the sticky bar not be shown and then put the search page on top in the layers.
But you want the sticky bar to be shown, and then we have to lower the search page. I think I have found a way.
You can experiment with the padding to fit the sticky by changing the 150 to the size that suits you.
Hope this is better.
Please try this :
<style>
#imSearchPage {
padding-top: 150px;
}
</style>
Author
that is perfect!!! problem solved - thank you so much. I really appreciate it!
Kind Regards
Wayne