${post.title}
`\n o += `Sorry, nothing found...
'\n> }\n> ```\n\n- **customProcessing** (function)\n> You need to do some extra modification on the posts data fetched from Ghost?\n> Use this function to do whatever you need. This function is called on each post,\n> executed after the `onFetchEnd()` and before the `onIndexBuildStart()`.\n>\n> If you want to discard a post, return any JS falsy value (e.g. `null`,\n> `undefined`, `false`, `\"\"`, ...).\n>\n> To easily debug your inputs/outputs, use the `onFetchEnd()` and `onIndexBuildEnd()`\n> to display the result with a `console.log()`. If you are a more advanced user, the\n> best option is still to use the debugger. Also, do not forget to clean your local\n> cache when testing!\n>\n> *note*: by default, this option is already filled with a helper function to make it\n> easier to use the field \"tags\" in posts. See the `indexedFields` options.\n>\n> example:\n> ```js\n> customProcessing: function(post) {\n> post.extra_field = \"hello\";\n> return post;\n> }\n> ```\n\n- **date** (object)\n> Define the date format fetched from posts.\n>\n> See the [MDN reference](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString#Using_options) to get more information.\n>\n> example:\n> ```js\n> date: {\n> locale: \"fr-FR\",\n> options: { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }\n> }\n> ```\n\n- **cacheMaxAge** (number)\n> Set the cache maximum age in seconds. During this amont of time, if an already\n> existing index is found in the local storage, it will be loaded without any\n> additional HTTP request to confirm its validity. When the cache is purged, the value is reset.\n>\n> This is espacially useful to save the broadband and network loads of your server. The default\n> value is set to half an hour. This value comes from the default user session duration used by\n> Google analytics.\n>\n> default: `1800`\n\n- **onFetchStart** (function)\n> Define a callback function before we fetch the data from the Ghost API.\n>\n> This function takes no argument.\n>\n> example:\n> ```js\n> onFetchStart: function() {\n> console.log(\"before data fetch\");\n> }\n> ```\n\n- **onFetchEnd** (function)\n> Define a callback function when the fetch is complete. Even if modifications\n> made to `posts` are persisted, we recommand the use of the `customProcessing()`\n> function to do so.\n>\n> The function takes one argument: the array of all posts returned by Ghost itself.\n>\n> example:\n> ```js\n> onFetchEnd: function(posts) {\n> console.log(\"Total posts found on Ghost:\", posts.lenght);\n> }\n> ```\n\n- **onIndexBuildStart** (function)\n> Define a callback function before we start building the search index.\n>\n> The function takes no argument.\n>\n> example:\n> ```js\n> onIndexBuildStart: function() {\n> console.log(\"before building the index\");\n> }\n> ```\n\n- **onIndexBuildEnd** (function)\n> Define a callback function when the search index build is complete.\n>\n> The function takes one argument: the build FlexSearch index object.\n>\n> example:\n> ```js\n> onIndexBuildEnd: function(index) {\n> console.log(\"index built:\", index);\n> }\n> ```\n\n- **onSearchStart** (function)\n> Define a callback function before starting to execute the search query. For\n> instance, it could be used to hide the results HTML element while waiting for the\n> `onSearchEnd` completion or add any fancy transition effects. But in most cases,\n> this is not necessary because the search function is fast enough to be nice on eyes.\n>\n> The function takes no argument.\n>\n> example:\n> ```js\n> onSearchStart: function() {\n> console.log(\"before executing the search query\");\n> }\n> ```\n\n- **onSearchEnd** (function)\n> Define a callback function when the search results are ready.\n>\n> The function takes 1 argument: the array of matching posts.\n>\n> example:\n> ```js\n> onSearchEnd: function(posts) {\n> console.log(\"search complete, posts found:\", posts);\n> }\n> ```\n\n- **indexOptions** (object)\n> Add extra search index configuration or override the default ones. These options will\n> be merge with the already provided one:\n> ```js\n> {\n> doc: {\n> id: \"id\",\n> field: this.config.indexedFields\n> },\n> encode: \"simple\",\n> tokenize: \"forward\",\n> threshold: 0,\n> resolution: 4,\n> depth: 0\n> }\n> ```\n>\n> Also use this parameter to enable non-latin language support, see [this section](#language-settings).\n>\n> default: `{}`\n\n- **searchOptions** (object)\n> Made for advanced users, allows you to fine tune the search queries.\n> Refer to [this](https://github.com/nextapps-de/flexsearch/tree/0.6.22#custom-search) Flexsearch documentation.\n>\n> We use this specific query construction: `index.search(\"your query\", searchOptions)` so anything added\n> to `searchOptions` will be passed to Flexsearch this way.\n>\n> This parameter can be really handy when filtering posts based on a tag. As an example:\n> ```js\n> searchOptions: {\n> where: {\n> string_tags: \"getting started\"\n> }\n> }\n> ```\n>\n> Also note that the `limit` Searchinghost option is automatically merged into the `searchOptions`. In our case, it\n> would finally become:\n> ```js\n> searchOptions: {\n> where: {\n> string_tags: \"getting started\"\n> },\n> limit: 10\n> }\n> ```\n>\n> default: `{}`\n\n- **debug** (boolean)\n> When something is not working as expected, set to `true`\n> to display application logs.\n>\n> default: `false`\n\n\n## Language settings\n\nIf your blog uses a latin alphabet language (e.g. english, french, spanish) or a northern/eastern europeen one (e.g. german, swedish, hungarien, slovenian, estonian) the default configuration will work just fine. In the other cases, find the appropriate `indexOptions` value and add it to your main SearchinGhost configuration.\n\nTo create your own specific settings, refer to the\n[FlexSearch README](https://github.com/nextapps-de/flexsearch/tree/0.6.22#add-custom-matcher) and\n[these](https://github.com/nextapps-de/flexsearch/issues/51)\n[three](https://github.com/nextapps-de/flexsearch/issues/51)\n[issues](https://github.com/nextapps-de/flexsearch/issues/73).\n\nIf nothing works for you or if the resulting behaviour is not correct, feel free to [create an issue](https://github.com/gmfmi/searchinGhost/issues).\n\n### Arabic\n\n```js\nindexOptions: {\n encode: false,\n rtl: true,\n split: /\\s+/\n}\n```\n\n### Chinese, Korean, Japanese\n\n```js\nindexOptions: {\n encode: false,\n tokenize: function(str){\n return str.replace(/[\\x00-\\x7F]/g, \"\").split(\"\");\n }\n}\n```\n\n### Cyrillic, Indian, Sinhala\n\nThis option can be used by any space-separated word languages that uses complex characters.\n\n```js\nindexOptions: {\n encode: false,\n split: /\\s+/\n}\n```\n\n### Mixed language types\n\nIf you need to use multiple language types (e.g. Cyrillic/English or Indian/Spanish), use the dedicated\nconfiguration below. I know, it can look scary at first look but just copy/paste it and trust me.\n\n```js\nindexOptions: {\n split: /\\s+/,\n encode: function(str) {\n var regexp_replacements = {\n \"a\": /[àáâãäå]/g,\n \"e\": /[èéêë]/g,\n \"i\": /[ìíîï]/g,\n \"o\": /[òóôõöő]/g,\n \"u\": /[ùúûüű]/g,\n \"y\": /[ýŷÿ]/g,\n \"n\": /ñ/g,\n \"c\": /[ç]/g,\n \"s\": /ß/g,\n \" \": /[-/]/g,\n \"\": /['!\"#$%&\\\\()\\*+,-./:;<=>?@[\\]^_`{|}~]/g,\n \" \": /\\s+/g,\n }\n str = str.toLowerCase();\n for (var key of Object.keys(regexp_replacements)) {\n str = str.replace(regexp_replacements[key], key);\n }\n return str === \" \" ? \"\" : str;\n }\n}\n```\n\n\n## Q&A\n\n### Why use FlexSearch as search engine?\n\nAt first, we also tried these other solutions: [Lunr.js](https://github.com/olivernn/lunr.js/),\n[minisearch](https://github.com/lucaong/minisearch) and [fuse.js](https://fusejs.io/). At the end,\n[FlexSearch](https://github.com/nextapps-de/flexsearch) offered the best overall results with\n**fast** and **accurate** results, a **small enough** bundle size and it also was **easy** to\nsetup/configure. It got everything to be choosen!\n\n### Why my new article do not appear in the search results?\n\nNo worries, it is normal. SearchinGhost uses a cache system to store your blog data in the\nbrowser an limit network interaction. By default, cached data stored less than 30 minutes\nago are still considered as valid. After that time, the new article will be available to you.\n\nKeep in mind that other users may **not** need to wait 30 minutes depending on the last time they\ndid a research. If you was 1h ago, their cache will be purged and renewed so the article will show up.\n\nIf you want your users to be always perfectly up to date, set the `cacheMaxAge` to `0`. When doing so,\nyou should also set `loadOn` to `'focus'` to limit the number of HTTP requests.\n\n### How to optimize the pictures load time?\n\nBy default, when you use the `feature_image` URL variable to display images in your search results, you will always get the original/full size one\nand they are generally too large (in size and weight) for our needs, a miniature would be a better fit.\n\nSince Ghost V3, a media processing engine is embedded to create responsive images. By default, Ghost recreates 6 differents images\nof the given one. The available sizes are: `w30`, `w100`, `w300`, `w600`, `w1000`, `w2000`.\n\nIn our case, the easiest way load images faster is simply to use smaller images. Basically,\nwe want this URL `https://www.example.fr/content/images/2020/05/picture.jpg` (default one fetched from the Ghost API) to become\n`https://www.example.fr/content/images/size/w600/2020/05/picture.jpg` (the 600px width one).\n\nTo do so, update the configuration by adding a `\"customProcessing\"` field with the following code example. Of course, you can\nuse any of the available size mentioned above instead of `w600`.\n\n```js\ncustomProcessing: function(post) {\n if (post.tags) post.string_tags = post.tags.map(o => o.name).join(' ').toLowerCase();\n if (post.feature_image) post.feature_image = post.feature_image.replace('/images/', '/images/size/w600/'); // reduce image size to w600\n return post;\n}\n```\n\nThis modification is **not** immediate, you need a cache refresh to actually see the difference.\n\n### How to display the number of search results found?\n\nCreate an HTML element with the ID `\"search-counter\"` and leverage the `onSearchEnd()` function\nto fill it with the result. Here is an example:\n\n```html\n\n```\n\n```js\nonSearchEnd: function(posts) {\n var counterEl = document.getElementById('search-counter');\n counterEl.textContent = `${posts.length} posts found`;\n}\n```\n\n### Can I display the latest posts when nothing is found?\n\nYes, by using SearchinGhost internals methods but it is possible. It may look like\nblack magic but add the code below to your current configuration. Here, `searchinGhost`\nrefers to your own instance created with `new SearchinGhost(...)`.\n\n```js\nemptyTemplate: function() {\n var allPostsArray = Object.values(searchinGhost.index.l);\n var latestPosts = allPostsArray.slice(0, 6);\n searchinGhost.display(latestPosts);\n}\n```\n\n### Can I use this library with a JS framework?\n\nIf are using a framework like React, Vue or Angular, you probably do not want to let SearchinGhost\nmanipulate the DOM by itself. Because you definitely need to keep any content update within your framework,\nhere is the configuration you should use:\n\n```js\nvar searchinGhost = new SearchinGhost({\n key: '