Tipue Search, a site search jQuery plugin
Tipue Search is a site search jQuery plugin. It's free, open source, responsive and fast.


Tipue Search documentation.

Getting Started

If you haven't already done so, download Tipue Search and copy the tipuesearch folder to your site. You should also look at the demo included with Tipue Search.

Tipue Search usually consists of two parts, the search box and the results page. The results page displays the search results.

To create a search box, the following should be included in the <head> section of your page. It loads the CSS for the search box.

The following code creates the search box. The form action attribute should point to your results page.
You can, of course, design your own search box. Below are the minimum values required. You won't need to load the Tipue Search CSS.
Tipue Search uses various modes for loading content, and therefore has various results page structures. To get started we'll use Static mode, which can be used without a web server. Static mode uses site content stored in the tipuesearch_content.js file.

Static mode is the default mode for Tipue Search, and also the fastest. We recommend using Static mode wherever practical.

The following should be included in the <head> section of your results page.

The first line loads the Roboto font from Google Web Fonts, which is optional. The second line loads the popular normalize.css, a library that forces browsers to render elements more consistently. This is recommended, but again optional. It is included with Tipue Search.

The third line loads jQuery via the Google Hosted Libraries.

The remaining lines load the content to be searched, the Tipue Search CSS, the Tipue Search Options and the Tipue Search jQuery plugin.

The following code displays the search results, along with a search box above.

Static mode uses site content stored in the tipuesearch_content.js file. It contains the search data as a JavaScript object.
You can create a Static mode JavaScript object for your website with Beaty. After your site has been indexed, select Tipue Search and then copy the content into a new text file. Save this file as tipuesearch_content.js.

If build your content by hand, note that the last record doesn't end with a comma. Some characters may need to be escaped, such as " or \. These should be preceded with a backslash.

The tags field includes keywords that don't appear in the title and text fields. It should be left empty if not needed, rather than omitted. Tags are separated by spaces.

Finally, you need to call the tipuesearch() method. Include this towards the end of the results page.

And that's it! Tipue Search is a powerful tool, and this is just the basics. So please read on.