Lazy-load InstantSearch scripts and stylesheets (#3691)
* Lazy-load InstantSearch scripts and stylesheets * Replace outdated script parts
This commit is contained in:
parent
7aee05ce0c
commit
75841313de
@ -1,19 +1,26 @@
|
|||||||
<!-- Including InstantSearch.js library and styling -->
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch.min.js"></script>
|
|
||||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch.min.css">
|
|
||||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch-theme-algolia.min.css">
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// Instanciating InstantSearch.js with Algolia credentials
|
// Including InstantSearch.js library and styling
|
||||||
|
const loadSearch = function() {
|
||||||
|
const loadCSS = function(src) {
|
||||||
|
var link = document.createElement('link');
|
||||||
|
link.rel = 'stylesheet';
|
||||||
|
link.type = 'text/css';
|
||||||
|
link.href = src;
|
||||||
|
link.media = 'all';
|
||||||
|
document.head.appendChild(link);
|
||||||
|
};
|
||||||
|
|
||||||
|
var script = document.createElement('script');
|
||||||
|
script.setAttribute("type", "text/javascript");
|
||||||
|
script.setAttribute("src", "https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch.min.js");
|
||||||
|
script.addEventListener("load", function() {
|
||||||
|
// Instantiating InstantSearch.js with Algolia credentials
|
||||||
const search = instantsearch({
|
const search = instantsearch({
|
||||||
appId: '{{ site.algolia.application_id }}',
|
appId: '{{ site.algolia.application_id }}',
|
||||||
apiKey: '{{ site.algolia.search_only_api_key }}',
|
apiKey: '{{ site.algolia.search_only_api_key }}',
|
||||||
indexName: '{{ site.algolia.index_name }}',
|
indexName: '{{ site.algolia.index_name }}',
|
||||||
searchParameters: {
|
searchParameters: {
|
||||||
restrictSearchableAttributes: [
|
restrictSearchableAttributes: ['title', 'content']
|
||||||
'title',
|
|
||||||
'content'
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -51,12 +58,25 @@ search.addWidget(
|
|||||||
})
|
})
|
||||||
);
|
);
|
||||||
|
|
||||||
// Starting the search only when toggle is clicked
|
|
||||||
$(document).ready(function () {
|
|
||||||
$(".search__toggle").on("click", function() {
|
|
||||||
if (!search.started) {
|
if (!search.started) {
|
||||||
search.start();
|
search.start();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
document.body.appendChild(script);
|
||||||
|
|
||||||
|
loadCSS("https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch.min.css");
|
||||||
|
loadCSS("https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch-theme-algolia.min.css");
|
||||||
|
};
|
||||||
|
|
||||||
|
// Starting the search only when toggle is clicked
|
||||||
|
$(document).ready(function() {
|
||||||
|
var scriptLoaded = false;
|
||||||
|
|
||||||
|
$(".search__toggle").on("click", function() {
|
||||||
|
if (!scriptLoaded) {
|
||||||
|
loadSearch();
|
||||||
|
scriptLoaded = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user