Title: Awesome Instant Search
Author: jameelbokhari
Published: September 14, 2013
Last modified: January 12, 2014
---
Search plugins
This plugin **hasn’t been tested with the latest 3 major releases of WordPress**.
It may no longer be maintained or supported and may have compatibility issues when
used with more recent versions of WordPress.
# Awesome Instant Search
By [jameelbokhari](https://profiles.wordpress.org/jameelbokhari/)
[Download](https://downloads.wordpress.org/plugin/awesome-instant-search.1.1.2.zip)
* [Details](https://wordpress.org/plugins/awesome-instant-search/#description)
* [Reviews](https://wordpress.org/plugins/awesome-instant-search/#reviews)
* [Installation](https://wordpress.org/plugins/awesome-instant-search/#installation)
* [Development](https://wordpress.org/plugins/awesome-instant-search/#developers)
[Support](https://wordpress.org/support/plugin/awesome-instant-search/)
## Description
Awesome Instant Search integrate Instant Search to ANY wordpress website using CSS
seletors. If you are familiar with CSS already, you should have no problem setting
this up. The less experienced can use [my full tutorial](http://www.jameelbokhari.com/awesome-instant-search/)
to set up in 15-20 minutes.
After installing the plugin, go to Settings->Awesome Instant Search in your admin
panel. On the first tab, General Settings, you can activate the plugin, but you
should probably set it up first.
If you are working with the TwentyThirteen theme, the plugin should work out of
the box.
TwentyTwelve and TwentyTen can be applied instantly as well. Go to the
plugin settings page described above, and under the General Settings use the dropdown
next to Theme Quick Settings to select between twentythirteen, twentytwelve and
twentyeleven. Again, if you are not using these themes you have to set the plugin
up to fit your particular theme. Unfortunately there’s not a way (that I know of)
that will get this plugin working out of the box!
For the quick tutorial, see below. For those of you unfamiliar with simple HTML
and CSS concepts, [see my full tutorial](http://www.jameelbokhari.com/awesome-instant-search/).
#### The Essentials
Essentially, you need to configure three settings.
* Search Field Selector
* Page Content Selector
* Search result selector
If you know your `HTML` pretty well, here’s what to do: Assign _Search Field Selector_
to the class or ID of your search field(s) in your website. The default `input[name
="s"]` should work for any website.
Assign _Page Content Selector_ to the ID of the element you want your search results
to appear in. Remember to use a period (.) or hash sign (#) just like you would
with a `CSS` selector. So for example `#content`. Just like with CSS you can be
more specific when you need to, e.g., `#main #content .container` and so on. Keep
in mind, this content will be hidden on the current page where the search is performed.
Next, in the same fashion, assign a selector for the search results. In about 99%
of websites, this is going to be the same as the content selector with .hentry added
in there. For example, if you assigned `#content` as your _Page Content Selector_,
you would use `#content .hentry` as your _Search Result Selector_.
These are the three most important settings. After you get these, go ahead and test
it out or play with the other settings.
#### Other Settings
**Search URL** is where the search results appear. This is your wordpress website’s
domain with the letters `?=s` appended to it — e.g., http://www.example.com?=s
This shouldn’t need to be changed but is there just in case you ever need to change
it.
**Hide These Elements** If you want additional elements to be hidden when performing
a search, use this option. These elements will be revealed again when the search
is cleared. This value accepts comma separated `CSS` selectors, use it to hide comments,
page navigation and other extraneous elements when searching.
**Before Instant Results** is `HTML` to appear before the Instant Search results.
Use the tag %%SEARCH_TERM%% to print the search term, e.g., `Search results
for: "%%SEARCH_TERM%%"
` might show up as `Search results for: "Contact
Info"
` on your page.
**Theme Quick Settings** Quickly access default settings for twentyten, twentytwelve,
and twentythirteen.
#### Translation
* Español [Maria Romos with Web Hosting Hub](http://www.webhostinghub.com/).
## Installation
1. Upload `awesome-instant-search` folder to the `/wp-content/plugins/` directory
2. Activate the plugin through the ‘Plugins’ menu in WordPress
3. Navigate to the Settings Page
4. Navigate to the Awesome Instant Search page under settings
5. Set up settings for your theme ([see my tutorial](http://www.jameelbokhari.com/awesome-instant-search/))
6. Activate the plugin under the General Settings tab on the plugin settings page
## Reviews
There are no reviews for this plugin.
## Contributors & Developers
“Awesome Instant Search” is open source software. The following people have contributed
to this plugin.
Contributors
* [ jameelbokhari ](https://profiles.wordpress.org/jameelbokhari/)
[Translate “Awesome Instant Search” into your language.](https://translate.wordpress.org/projects/wp-plugins/awesome-instant-search)
### Interested in development?
[Browse the code](https://plugins.trac.wordpress.org/browser/awesome-instant-search/),
check out the [SVN repository](https://plugins.svn.wordpress.org/awesome-instant-search/),
or subscribe to the [development log](https://plugins.trac.wordpress.org/log/awesome-instant-search/)
by [RSS](https://plugins.trac.wordpress.org/log/awesome-instant-search/?limit=100&mode=stop_on_copy&format=rss).
## Changelog
#### 1.1.2
* Fixed some wording.
* Completed Spanish translation for last minute features.
#### 1.1.1
* Fixed issue with last commit, files got mixed up.
* Added feature to set minimum screen size that Awesome Instant Search requires
to trigger so it can be turned off on smaller and (presumably low bandwidth)
devices.
#### 1.1.0
* He añadido la traducción español thanks to [Maria Romos with Web Hosting Hub](http://www.webhostinghub.com/index-c.html?utm_expid=31925339-46.KEGZK8A6Q3yfZW0EUfEw5Q.1).
Plugin is also ready for other languages.
* Fixed bug involving the plugin saving the help info text.
* Fixed possible issue arrising when the site_url is changed (e.g., production
to live). Users can now manually set the plugin directory if needed. This process
may be cleaned up more in the future.
* Changed some wording to clarify settings
#### 1.0.0
* Initial Release
## Meta
* Version **1.1.2**
* Last updated **12 years ago**
* Active installations **10+**
* WordPress version ** 3.0.1 or higher **
* Tested up to **3.8.0**
* Tags
* [ajax](https://wordpress.org/plugins/tags/ajax/)[autocomplete](https://wordpress.org/plugins/tags/autocomplete/)
[instant search](https://wordpress.org/plugins/tags/instant-search/)[search](https://wordpress.org/plugins/tags/search/)
* [Advanced View](https://wordpress.org/plugins/awesome-instant-search/advanced/)
## Ratings
No reviews have been submitted yet.
[Your review](https://wordpress.org/support/plugin/awesome-instant-search/reviews/#new-post)
[See all reviews](https://wordpress.org/support/plugin/awesome-instant-search/reviews/)
## Contributors
* [ jameelbokhari ](https://profiles.wordpress.org/jameelbokhari/)
## Support
Got something to say? Need help?
[View support forum](https://wordpress.org/support/plugin/awesome-instant-search/)
## Donate
Would you like to support the advancement of this plugin?
[ Donate to this plugin ](http://jameelbokhari.com/)