[Question] How to add Search function #260

To add a search function you need to have a plugin that handles the search. Example:

this.search = {
      handler: keyword => {
        return entries.filter(value =>
          value.title.toLowerCase().includes(keyword.toLowerCase())
        )
      }
    }
    this.search.enabled = true

where entries is a list of all pages you want to make searchable.

Had the same problem so I'll add this in case that's helpful for someone.

I used @DeveloperBen function.

---

First, you'll need to call your API to get the array with your data:

// Fetch this from your API
var SearchResult = [
  {title: 'Title', link: 'title1', label: 'Label is optional', description: 'Description is optional'},
  {title: 'Another', link: 'another'},
  {title: 'One more', link: 'one-more'},

];

Then, create a plugin object:

const searchBar = entries => {
    return {
        name: 'searchBar',
        extend(api) {
            api.enableSearch(
                {
                    handler: keyword => {
                        return entries.filter(value =>
                            value.title.toLowerCase().includes(keyword.toLowerCase()))
                    }
                }
            );
        }
    }
}

Finally, enable plugin in Docute object and pass your array:

    plugins: [
        searchBar(SearchResult)
    ],

<img width="414" alt="Screenshot 2019-12-02 at 15 44 15" src="https://user-images.githubusercontent.com/4931648/69968405-a2083000-151a-11ea-96d2-3b4a06bcb0ea.png">

References

api.enableSearch Plugin

Hi, i tryed the above example to add a searchbar, but it does not work. the field is there but the search does not work

thanks for any help

cheers Ludwig