Sha256: a91f1adf8c26b0f11942c8130144721df1c87a25be878fc965d5f846ea07a545
Contents?: true
Size: 1.74 KB
Versions: 12
Compression:
Stored size: 1.74 KB
Contents
<script src="https://cdn.jsdelivr.net/npm/instantsearch.js/dist/instantsearch.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.20.1/moment.min.js"></script> <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch.min.css"> <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch-theme-algolia.min.css"> <script> const search = instantsearch({ appId: '{{ site.algolia.application_id }}', apiKey: '{{ site.algolia.search_only_api_key }}', indexName: '{{ site.algolia.index_name }}', searchParameters: { restrictSearchableAttributes: [ 'title', 'content' ] } }); const hitTemplate = function(hit) { let date = ''; if (hit.date) { date = moment.unix(hit.date).format('MMM D, YYYY'); } const url = hit.url; const title = hit._highlightResult.title.value; const content = hit._highlightResult.html.value; return ` <div class="post-item"> <h2><a class="post-link" href="${url}">${title}</a></h2> <div class="post-snippet">${content}</div> </div> `; } search.addWidget( instantsearch.widgets.searchBox({ container: '#search-searchbar', placeholder: 'Search into posts...' }) ); search.addWidget( instantsearch.widgets.hits({ container: '#search-hits', templates: { item: hitTemplate } }) ); search.start(); </script> <style> .ais-search-box { max-width: 100%; margin-bottom: 15px; } .post-item { margin-bottom: 30px; } .post-link .ais-Highlight { color: #111; font-style: normal; text-decoration: underline; } .post-snippet .ais-Highlight { color: #2a7ae2; font-style: normal; font-weight: bold; } </style>
Version data entries
12 entries across 12 versions & 1 rubygems