Lets start with an example

1. Create a new Search Form
2. Add some fields to the Search Form UI by dragging from the Available Fields box in to the UI box – for this example lets just add a Search Field and a Submit Button
3. In the Settings box, under the Display Results tab select “Using a Shortcode” – you will now notice the Shortcodes meta box (underneath the Publish box) has an additional secondary shortcode called the Results Shortcode.
4. Publish this.
5. Now, create a New Page, on this page add both the shortcodes found in your Shortcodes metabox (your IDs will be different):
6. Publish the page, and then click View Page
7. Copy the Full URL of this page from the address bar and paste into the the S&F form, in the Results URL option and update (this can be found in the Display Results tab).

And there you have it, reload the page you created with the two shortcodes and you should find both your Search Form and Search Results visible and working correctly.

Customising the Results

If you wish to customise the display of your results, you must override the default template that is being used by Search & Filter:

1. Create a folder in your child theme folder called search-filter.
2. Copy the file wp-content\plugins\search-filter\templates\results.php from the templates folder in to the newly created folder in your theme – wp-content\themes\your-child-theme-name\search-filter\results.php

From now on, Search & Filter will load this version of the template instead of its own – so you can make any customisations that are necessary.

Multiple Search Forms, – I don’t want all my results looking the same!?

Well that’s not too difficult – in this case you can use the ID of the search form to target it specifically – and place the template as you just have with the `results.php` file:

wp-content\themes\your-child-theme-name\search-filter\

For example, if a Search Form had an ID of 14, then I would create a template in this folder called `14.php` – that only this Search Form could use for displaying its results – the file would then be located:

wp-content\themes\your-child-theme-name\search-filter\14.php

Configuring Ajax

The beauty of using the shortcode method with Ajax is that it almost works out of the box.  Simply enable Ajax and your good to go – just make sure that your Results URL is properly filled out and pointing at the correct page.