This recipe explains how to implement quick search results.
For this recipe to work, you need jQuery. Also, you should also have set up the search form as described in this previous recipe.
Quick search results are the ones that appear while typing into the search box.
The image shows quick search results for the word 'Recipe' in Confluence.
Extend the Search Result Template
In your template file search.vm overwrite or merge the existing code with the template below:
This template contains both the search form, search results and quick search results. The results will be loaded into the container with the id
search-results. Whenever you search with the GET parameter
You can position and style the quick results any way you want. If you need inspiration, check out how we styled ours in our help center search function.
Getting the search results through AJAX
As you can see, when the user types more than 3 letters, a request will be sent and the search results will be loaded in the results container.
A working implementation of this recipe can be found in the Scroll Help Theme (Viewport's default theme). This is the method we use to load search results in the mobile sidebar.
Including page-relevant properties
If you want to display other search result-relevant data such as the spaceKey, you can retrieve the object with
This will give you, depending on the object type (page, blog_post, user, status and attachment) a placeholder.
So we have to make sure that we are retrieving data from a ContentPlaceholder in order to get the spaceKey.
Please see the Template Reference for a list of all available placeholders.
A search form can be modified to search just for users with the User Search Recipe.