https://fintualist.com/assets/js/search.js?v=t9d0jMv22lZtAWeJ

1// Get the modal
2var modal = document.getElementById("searchModal");
3
4// Get the button that opens the modal
5var btn = document.getElementById("searchBtn");
6
7// Get the search input field
8var input = document.getElementById("ghost-search-field");
9
10// Get the <span> element that closes the modal
11var span = document.getElementsByClassName("close")[0];
12
13// When the user clicks the button, open the modal
14function showModal() {
15  modal.style.display = "block";
16}
17
18//Area for search results – if input is empty search area is hidden
19input.oninput = function (e) {
20  document.getElementById("ghost-search-results").style.display = "grid";
21  if (input.value == "") {
22    document.getElementById("ghost-search-results").style.display = "none";
23  }
24};
25
26// When the user clicks on <span> (x), close the modal
27span.onclick = function () {
28  modal.style.display = "none";
29};
30
31// When the user clicks anywhere outside of the modal, close it
32window.onclick = function (event) {
33  if (event.target == modal) {
34    modal.style.display = "none";
35  }
36};
37
38let ghostSearch = new GhostSearch({
39  key: "421f9f1669a92fdf7d21a0a285", // Inside Ghost backend
40  url: "https://fintual.ghost.io", // Inside Ghost backend
41  results: "#ghost-search-results",
42  template: function (result) {
43    //get the current country
44    let country = getCookie("country");
45    //Empty array for result tags
46    let resultTags = [];
47    //Get tags of each result
48    for (tag in result.tags) {
49      resultTags.push(result.tags[tag].name);
50    }
51    //If one of the array items has current country display result
52    if (resultTags.includes("#" + country)) {
53      return '<article><figure class="search-img"><img src="' + result.feature_image + '" /></figure><div><h2><a href="' + result.url + '">' + result.title + "</a></h2><h5>" + result.excerpt + "</h5></div></a></article>";
54    } else {
55      // If not return span (is hidden by css). Dom element is nessesary otherwise JS fires error
56      return "<span></span>";
57    }
58  },
59  options: {
60    keys: ["title", "primary_author.name"],
61    limit: 25,
62  },
63  api: {
64    resource: ["posts"],
65    parameters: {
66      limit: "all",
67      fields: ["title", "slug", "url", "feature_image", "excerpt", "primary_author"],
68      filter: "",
69      include: ["tags", "authors"],
70      order: "",
71      formats: "",
72    },
73  },
74});