Installation Ready-made View

The AddSearch WordPress plugin allows anybody with a self-hosted WordPress website to install AddSearch easily. The plugin replaces the existing search of your website with AddSearch, allowing your users to enjoy an instant and lightning-fast search.

Please note that websites hosted on wordpress.com are not supported, due to WordPress limitations.

Here’s how to install the AddSearch WordPress Plugin:

  1. Go to the AddSearch home page and sign up with your WordPress website address and your email.
  2. Open the AddSearch dashboard, go to Setup → Keys and Installation and copy your site key under Your Site Key.
  3. Install and activate the AddSearch plugin from the WordPress admin interface.
  4. Paste the Site Key in Settings → AddSearch and click Save.
  5. Select whether you want to use search-as-you-type search widget (default), or more traditional separate results page.
  6. Go to Appearance → Widgets. Drag the WordPress native Search Widget to your preferred widget area.

To modify the settings of your search, log in to the AddSearch Dashboard.

WordPress Shortcode

With the shortcode [addsearch] you can add multiple AddSearch fields to your website. Add the shortcode to a page, blog post, navigation or anywhere, and a search field will appear there.

Modify look and feel of the search input field

WordPress provides Additional CSS editor to modify the CSS of your theme. To modify the look and feel of the search input field, follow these instructions

  1. Login to your WordPress Dashboard
  2. Hover over Appearance
  3. Click Customize

Picture of WordPress dashboard Appearance menu.

  1. Click Additional CSS on the bottom left of the page

Picture of Additional CSS link in Customize WordPress page.

  1. Add selector (input.addsearch) and styles into the textfield
input.addsearch {
    /* 
      Add your styles here
    */ 
}
  1. Click Publish to save your changes

Picture of Additional CSS editor in WordPress Customize page.

Visit this WordPress article for more information on Custom CSS and Additional CSS.

Was this helpful?

Need more help?

We’re always happy to help with code or other questions you might have. Search our documentation, contact support, or connect with our sales team.