Creating a search form

[joeville9jaParticipant]

How Can I achieve a search like the one uploaded. Its meant to search via different locations which is a drop down menu. I’m having issues achieving this with the plugin

• This topic was modified 6 years, 6 months ago by  joeville9ja.

Attachments:

You must be logged in to view attached files.

[Ernest MarcinkoKeymaster]

Hi!

I’m not sure if it’s possible to make an exact replica of the screen-shot, but it’s definitely possible to get something very similar.

Step 1: you need to make the settings filter (drop-down) on the left. Now, depending on how the information is connected to the posts you either need a:
– Taxonomy term filter
– or Custom field filter

Step 2: Once you managed to create the filter you need, first of all you need to turn off all of the other default ones so that only that one drop-down remains visible. To do that go to the Frontend Search settings -> General panel: https://i.imgur.com/TEjpcqz.png

Step 3: Now you also want to make sure that the filter is visible at all times, so on the same panel turn on the Set the search settings to visible by default? option: https://i.imgur.com/DX1O6uI.png

Step 4: Now that everything is ready, you want to place the plugin shortcodes in a way that the settings are on the left and the search bar on the right. For that you can use the shortcode generator: https://i.imgur.com/yUiYWen.png

Basically the shortcode generator allows you to generate search shortcodes in the layout you specify. In the example above I made a shortcode that displays the settings box on the left, the search on the right with a 30/70 ratio:

[wd_asp elements='settings,search' ratio='30%,70%' id=1]

In my case this results in something like this: https://i.imgur.com/5RROVSc.png

Of course some styling might be required, but this is the general idea.

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

[joeville9jaParticipant]

OK Thanks. But how can I centralise the search form on the page while using the php shortcode. I am inserting it into my theme’s file, to show on the header or next to the header.

[Ernest MarcinkoKeymaster]

Hi,

Well, it depends on the exact situation as well, but there are two options in this case:

1. Try to change the Search box alignment option to “center” on the Layout options -> Search box layout panel: https://i.imgur.com/p4OgFEg.png

2. Using a custom CSS, something like:

.asp_main_container {
    margin: 0 auto !important;
}

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

[Author]

Posts