Set up search

Simply Static included two different search solutions. A file-based local search indexA list or database used to make searching faster. based on Fuse.js and API integrationThe process of connecting different software applications using their APIs (Application Programming Interfaces) to allow… with Algolia.

Once activated, Simply Static will automatically generate the search index on each full static exportThe process of saving the files and data from your WordPress site to create a static site..

ConfigurationThe setup process where you specify the settings and options for how a software or system will operate.

You should start by configuring the search in Simply Static -> Settings -> Search. First, you need to decide whether or not you want to use the search integrationThe act of combining different systems, software, or functionalities to work together as a unified whole. and which solution you want to use: Fuse.jsA lightweight JavaScript library for searching, which allows for more flexible and forgiving searches. or AlgoliaA record of all the actions and changes made within the Simply Static plugin. It helps you track what has been done..

Indexing

You can configure what Simply Static should index and display in search results. It provides some defaults, but you can use pretty much any HTMLHyperText Markup Language. It’s the standard language for creating web pages. tag you like.

You can also exclude specific URLs or just patterns from indexing to optimize the search experience for your visitors.

CSS-Selector

You can add a CSSCascading Style Sheet. It’s a language used for describing the look and formatting of a document written in HTML. selector for your existing search input field, and Simply Static Pro will automatically convert it to a static search input.

Where do I find the CSS-SelectorA pattern used to select the element(s) you want to style in a web page.?

You can get the CSS-Selector of your search input field directly from your website. Open your browser consoleA tool within web browsers that helps developers troubleshoot issues by displaying errors, warnings, and other informati… and inspect your current search box. Here is an example of the TwentyTwenty WordPress theme:

Algolia

To use Algolia for the search integration you need an account at Algolia. The service is free to use as long as you don’t have more than 10.000 searches per month.

Create Index

Once you have created an account at Algolia, go to search and click on “Create Index”. A little box will appear that you can fill out with the necessary information:

API Keys

Next, we have to get the API keys. Click on your profile picture in the top-right -> Settings and then click on “Manage Applications”:

Click on “New Application” and follow the dialog to set up your project:

Once you have finished the setup go into your project and click on “API Keys”:

Add API Keys to Simply Static

Here you can copy the necessary information to fill out the fields in Simply Static -> Settings -> Search -> Algolia:

Add the Application IDA unique attribute used to identify a single element on a webpage. It is often used for linking, styling, or scripting., Admin API KeyA unique code that allows different software applications to communicate with each other. It’s used for identification a…, and Search-Only API Key from your project.

Add the name of the index you have used while setting up the index in your Algolia account.