Installation on a regular website

You can find your Site Key find once you log in to your Admin Panel, under Installation. Installation involves copying a single line of code to your site template. After installation, there is zero maintenance needed.

Quick Method

To install AddSearch on your site, follow these instructions:

  1. Access the design template of your site. If you’re using a content management system, this template will reside in a menu called “Theme”, “Template”, “Design”, “Appearance” or similar. For WordPress sites, the templates reside in Appearance -> Editor.
  2. If you have an existing search on your site: Go to site template edit and find your site’s search form. This is a HTML element that starts with a <form> tag, such as <form id="search">. Once you’ve found the relevant <form> tag, delete it, and everything up to and including the closing </form> tag.
  3. Copy the JavaScript code below (and replace #### with your Site Key) to where ever you want the AddSearch field to appear:
    <script src="https://addsearch.com/js/?key=####"></script>
  4. Save the changes to your template and publish them to your website.

When using the Quick Method above, the AddSearch script inserts a single search field into the site. The look & feel of the search field can then be customized via the AddSearch Dashboard.

Advanced Method

When using the advanced method, the CSS for the search field in the Admin Panel > Settings> “Look & Feel” customization will not be applied. You need to define the CSS for the search field on your site’s style sheets.

If you want to have multiple search fields on one page or use your own input field with special styles, use the Advanced Method described below.

  1. Access the design template of your site. If you’re using a content management system, this template will reside in a menu called “Theme”, “Template”, “Design”, “Appearance” or similar. For WordPress sites, the templates reside in Appearance -> Editor.
  2. Insert one or more <input type="text" class="addsearch"/> elements where you want your search fields to reside. You can define multiple CSS class names to your input fields, but make sure that addsearch class is one of them.
  3. Copy the below JavaScript code (and replace #### with your Site Key) to the bottom of your page, before the <body> tag, but after the <input type...> element from the previous step.
    <script type="text/javascript" src="https://addsearch.com/js/?key=####"></script>
  4. Save the changes to your template and publish them to your website.