Search Bar Fly-Out Placement + Search Result Page

[DanHostettler45]

Hi Ernest,

Happy New Year!

As discussed via email a month ago, I have now purchased + installed the latest version of ASP. All’s running smoothly but I do have 2 open questions.

1. Search Bar Fly-Out Placement
2. Search Result Page

I have created a detailed PDF that lists my thoughts, references + questions. It also contains the login to my DEV server.

Thanks for having a look into this and for coming up with some hints + ideas.

Best regards from Spain,
Dan

[Ernest Marcinko]

Hi,

Thank you very much for your kind words!

Q1) Okay. There is the compact box feature, which is very useful if you have a tiny space to fit the search to. One great thing is, that you can use “vw” aka “window width” CSS values to set a dynamic width of the final search box size, for example: https://i.imgur.com/PShEfdg.png
50vw will limit the search box final width to 50% of the overall window viewport width.
I would definitely recommend experimenting with these dynamic properties.

Q2) Yes – You can just set that feature to actually redirect to the results page: https://i.imgur.com/jvhhfjX.png

[DanHostettler45]

Hi Ernest,
Thanks for your swift feedback! OK:

Q1) I already used the option of compact box yet since ASP’s DIV is implemented within the MastHead DIV, there’s never enough space on smaller screens. Yet (!), I came up with a workaround, hiding more MastHead elements when under 1024. I updated the JS accordingly and now at least “space-wise” it works. It’s not the most elegant solution, but it does the trick for now. Thanks!

Q2) OK, got it. I missed that! Follow-up up Q here >
Although reading the KB (https://documentation.ajaxsearchpro.com/layout-settings/more-results-link) it’s unclear for me, how to implement the “Redirect to custom URL”.

1. I have created a page/template > https://wordpress-673625-3090857.cloudwaysapps.com/search-results
2. Yet whatever I choose to put into the ” ‘ Show more results..’ url “, I am getting a 404.
3. Pls see my attempts in the following screenshot: https://imgur.com/a/haDJbdC

Thank you,
Dan

[Ernest Marcinko]

Hi Dan,

Q2) Sorry about that, I forgot.

This is a bit more complicated. Simply creating a template file will not move the results page from one location to another. WordPress has an automatic results page handler, which is triggered whenever the main site URL is hit with the presence of the “s” parameter, like: yoursite.com/?s=phrase

Only by creating a page/template on a different URL will not move the search results page there. Ajax Search Pro can only redirect to an existing results page handler, it will not move the actual results page to that URL.
The reason behind it is, that it’s rather complicated, it requires special mod_rewrite rules, which should not conflict with existing permalink structures and so on..

I generally do not recommend moving the results page slug, in most cases it generates more issues. However you can check out this tutorial on how to make a custom results page permalink. Keep in mind, that this may not work out of the box, for every case it is very different. I only recommend starting with moving the results page URL if you have experience in apache mod_rewrite rules and have some spare time.

[DanHostettler45]

Hi Ernest,

No worries! And, thanks for the clarification.

I see – so, my assumption was a tad simplistic 🙂 The whole idea of having a separate template was bcs of the page’s styling. But in this case, I will find another way to inject CSS dynamically into the search result page, using our Custom CSS + JS plugin. This will do the trick.

Thanks for all your support!

Best,
Dan

[Ernest Marcinko]

You are very welcome Dan 🙂

If you don’t mind, I will close this topic soon and mark it as resolved, feel free to open another one if you have other questions or issues.

[DanHostettler45]

Ernest, yes, please, mark it as resolved. Thanks!

[Author]

Posts