Make the rest of the site darkish when search is in use

[DonovanrayParticipant]

Hello WPDreams,

I saw a cool search feature on a competitors site. And I was wandering if this was possible with the Ajax Search Pro for WordPress plugin.

It’s on: toneronlinebestellen.nl

When you click on the search bar, the rest of the site turns “darkish”. So only the search bar and the results are “highlighted”. This makes the focus on the search itself so much better. Is there a way to do this with the Ajax Search Pro for WordPress Plugin?

Thank you for your time.

Kind regards,

Erwin

[Ernest MarcinkoKeymaster]

Hi Erwin,

At this point this feature is only available with the compact box layout mode. For example, click on the search icon on the side of the demo page: https://i.imgur.com/hDxZDCX.png

There is no workaround solution for this unfortunately. It has to do with z-indexes and how the elements act in different positions. For example, if the search bar is not positioned as a top level element (placed within the content or so), then there is no reliable way of adding a whole ‘dark’ background to the page, and somehow lifting the search element above it. There are some workarounds, but all of them are non-usable.

On the page you provided it is working nicely, since the search and the background element are placed into a top level node, by design. This however is not true in most cases when the search shortcode is used, so the same solution would not work.

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[Author]

Posts