Download the Plugin

Description

SearchAutocomplete implements the jQuery UI Autocomplete functionality on your WordPress installation. It provides several basic options such as:

  • jQuery ThemeRoller integration
  • Generic field selection. Any valid jQuery selector can be used to pick the search field
  • Minimum character count
  • Hotlink resulting Post/Page titles directly to their respective items
  • Matching characters are wrapper with ‘<span class=”sa-found-text”></span>’ to enabled highlighting via CSS

Filters

search_autocomplete_disable_frontscripts‘ – Use this filter to disable the rendering of all Search Autocomplete scripts to the browser.

add_filter( 'search_autocomplete_disable_frontscripts', 'saDisableFrontScripts' );

function saDisableFrontScripts() {
  return true; // return true to disable scripts, false to enable scripts
}

search_autocomplete_modify_title‘ – Use this filter to customize the title portion of the autocomplete drop down.

add_filter( 'search_autocomplete_modify_title', 'saModifyTitle', 10, 2 );

function saModifyTitle( $title, $object ) {
  return $title . ' - link';
}

search_autocomplete_modify_url‘ – Use this filter to customize the url portion of the autocomplete drop down.

add_filter( 'search_autocomplete_modify_url', 'saModifyURL', 10, 2 );

function saModifyURL( $link, $object ) {
  $newLink = 'http://hereswhatidid.com/';
  return $newLink;
}

search_autocomplete_modify_results‘ – This is the last filter applied to the results before sending them to the autocomplete drop down.

add_filter( 'search_autocomplete_modify_results', 'saModifyResults' );

function saModifyResults( $results ) {
  $newResults = array();
  foreach( $results as $result ) {
    $newResults[] = array(
      'title' => $result['title'],
      'url' => $result['url']
    );
  }
  return $newResults;
}

The object passed to the filters has the following contents:
If post:

array(4) {
  ["id"] => int(1133)
  ["type"] => string(4) "post"
  ["taxonomy"] => NULL
  ["postType"] => string(4) "page"
}

If taxonomy:

array(4) {
  ["id"] => string(2) "65"
  ["type"] => string(8) "taxonomy"
  ["taxonomy"] => string(8) "category"
  ["postType"] => NULL
}

Installation

  1. Download the plugin from the WordPress repository
  2. Upload searchautocomplete to the /wp-content/plugins/ directory
  3. Activate the plugin through the ‘Plugins’ menu in WordPress
  4. {Optional} If you want to add aditional themes to the settings, create the theme with the jQuery UI ThemeRoller and upload the resulting “/css/” directory to the “/css/” of this plugins installed directory.

FAQs

Can I just modify the existing theme files rather than upload new jQuery UI Themes?

Yes, but it’s recommended that you create a copy of the theme that you are going to modify rather than directly editing it. Future releases of this plugin may overwrite your changes if they are made to default theme files.

Screenshots