Skip to content

Instantly share code, notes, and snippets.

@erfg12

erfg12/Algalia_InstantSearch.html

Last active March 9, 2021 14:47
Show Gist options
  • Save erfg12/ea83d882064ba00a8a402345d8eb8013 to your computer and use it in GitHub Desktop.
Save erfg12/ea83d882064ba00a8a402345d8eb8013 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Algalia_InstantSearch.html
<html>
<head>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/algoliasearch.umd.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/instantsearch.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/instantsearch-theme-algolia.min.css">
</head>
<body>
<div>
<div id="searchbox" class="ais-SearchBox" onkeypress="searchTrigger()"></div>
<div id="hits"></div>
<div id="pagination"></div>
</div>
<script>
const search = instantsearch({
indexName: 'INDEX_NAME_HERE',
searchClient: algoliasearch(
'APP_ID_HERE',
'SEARCH_ONLY_KEY_HERE'
)
});
search.addWidgets([
instantsearch.widgets.searchBox({
container: '#searchbox',
placeholder: 'Search for topics',
}),
instantsearch.widgets.hits({
container: '#hits',
templates: {
item: `
<div>
{{title}}
</div>
`,
},
})
]);
function searchTrigger() {
search.start();
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment