Search Integration

Note: This functionality is part of Staatic Premium Edition.

Introduction

Staatic Search provides a dynamic backend and customizable search widget to allow visitors to search through the content of your site.

Enabling search integration

In order to provide search results to visitors of your static site, your posts, pages, and other content needs to be indexed by Static Search. Indexing your content and enabling the Search Widget is as easy as checking a box.

To enable search integration, following these steps:

  1. Go to the WordPress Admin and click Staatic > Settings > Integration.
  2. Make sure Enable search integration with WordPress search functionality is checked.
  3. Optionally, limit the Post Types that will be included in the search index.
  4. Click Save Changes.

Note: the search index will be created and kept up to date automatically when publishing your static site.

Customizing the search widget

The search widget included with Staatic Search has been designed to integrate well with most sites and themes. By default it automatically adjusts its dimensions to the size of the search query field.

There may be good reasons to change the appearance of the widget or the result list to improve integration within your site.

CSS styling

The easiest way to change the search widget’s appearance is by adding some CSS styling. The basic HTML structure of the search widget looks like this:

<input name="q" type="search"></input>

<div class="autocomplete-result-list" data-position="above|below">
  <div class="autocomplete-result">
    <a class="suggestion-link">
      <img class="suggestion-thumbnail"></img>
      <div class="suggestion-attributes">
        <span class="suggestion-title"></span>
        <span class="suggestion-content"></span>
      </div>
    </a>
  </div>
  </div>