GithubHelp home page GithubHelp logo

ghosthunter's Introduction

⚠️ GhostHunter has not been maintained since 2019

There is now a native search feature built-in to Ghost core:

https://ghost.org/changelog/search/








Version MinGhostVersion

ghostHunter

Original developer: [email protected]

GhostHunter makes it easy to add search capability to any Ghost theme, using the Ghost API and the lunr.js search engine. Indexing and search are done client-side (in the browser). This has several advantages:

  • Searches are private to the user, and are not exposed to third parties.
  • Installation and maintenance of powerful-but-daunting standalone search engines (such as Solr or ElasticSearch) is not required.
  • Instant search ("search-as-you-type" or "typeahead") is simple to configure.

Contents


Upgrade notes

GhostHunter v0.6.0

  • Implements @JiapengLi "dirty fix" to support the new Ghost v2 Content API.
  • Removes spurious production console.log message.
  • Removes includepages option.

To use this version of ghostHunter, you'll need to create a Custom Integration and inject its Content API key into your blog header. In your Ghost Settings:

  • Go to Integrations
  • Choose Add custom integration, name it ghostHunter and choose Create. Copy the generated Content API Key.
  • Go to Code injection
  • Add this to Blog Header:
<script>
  var ghosthunter_key = 'PASTE_THE_GENERATED_KEY_HERE';
  //optional: set your custom ghost_root url, default is `"/ghost/api/v2"`
  var ghost_root_url = "/ghost/api/v2"
</script>

GhostHunter v0.5.1

Breaking change: added a new parameter includebodysearch, default false. Leaving it false completely deactivates searching within post body. Change done for performance reasons for Ghost Pro members.

GhostHunter v0.4.x → v0.5.0

The local lunr.js index used by ghostHunter is quick. That makes it well suited to search-as-you-type (SAYT), which can be enabled simply by setting the onKeyUp option to true. Although fast and convenient, the rapid clearing-and-rewriting of search results in SAYT mode can be distracting to the user.

From version 0.5.0, ghostHunter uses a Levenshtein edit distance algorithm to determine the specific steps needed to transform each list of search results into the next. This produces screen updates that are easy on the eye, and even pleasant to watch.

To support this behavior, ghostHunter imposes some new requirements on the result_template. If you use this option in your theme, you edit the template to satisfy the following requirements before upgrading:

  • The template must be wrapped in a single outer node (i.e. <span> or div);
  • The outer node must have a unique id attribute. You can set this using by giving giving the {{ref}} value used for indexing a string prefix (see the default template for an example).
  • The outer node must be assigned a class gh-search-item.

That's it. With those changes, your theme should be ready for ghostHunter 0.5.0.

Basic setup

In your theme directory, navigate to the assets subdirectory, [1] and clone this repository there: [2]

  cd assets
  git clone https://github.com/jamalneufeld/ghostHunter.git --recursive

After cloning, the ghostHunter module will be located at assets/ghostHunter/dist/jquery.ghosthunter.js. [3] This is a human-readable "raw" copy of the module, and can be loaded directly in your theme templates for testing. (It will run just fine, but it contains a lot of whitespace and comments, and should be "minified" for production use [see below]).

To test the module in your template, add the following line, after JQuery is loaded. Typically this will be near the bottom of a file default.hbs, in the top folder of the theme directory.

<script type="text/javascript" src="{{asset "ghostHunter/dist/jquery.ghosthunter.js"}}"></script>

You will need to add a search box to your pages. The specific .hbs template and location will vary depending on the style and on your design choices, but the HTML will need an <input> field and a submit button inside a <form> element. A block like this should do the trick:

<form>
    <input id="search-field" />
    <input type="submit" value="search">
</form>

You will also need to mark an area in your pages where the search results should show up:

<section id="results"></section>

Wake up ghostHunter with a block of JQuery code. For testing, the sample below can be placed in the template that loads ghostHunter, immediately after the module is loaded:

  <script>
    $("#search-field").ghostHunter({
      results: "#results"
    });
  </script>

Do the necessaries to load the theme into Ghost, and see if it works. 😅

Advanced usage

Production installation

To reduce load times and network traffic, the JavaScript of a site is typically "minified," bundling all code into a single file with reduced whitespace and other optimizations. The jquery.ghosthunter.js module should be bundled in this way for the production version of your site. The most common tool for this purpose in Web development is either Grunt or Gulp. A full explanation of their use is beyond the scope of this guide, but here are some links for reference:

GhostHunter is built using Grunt. Instructions on installing Grunt in order to tweak or extend the code of the ghostHunter module are given in a separate section below.

GhostHunter options

The behavior of ghostHunter can be controlled at two levels. For deep changes, [4] see the section Development: rebuilding ghostHunter below.

For most purposes, ghostHunter offers a set of simple options can be set when the plugin is invoked: as an example, the last code sample in the previous section sets the results option.

➡️ results

Should be set to the JQuery ID of the DOM object into which search results should be inserted. This value is required.

Default value is undefined.

➡️ onKeyUp

When set true, search results are returned after each keystroke, for instant search-as-you-type results.

Default value is false

➡️ result_template

A simple Handlebars template used to render individual items in the search result. The templates recognize variable substitution only; helpers and conditional insertion constructs are ignored, and will be rendered verbatim.

From ghostHunter v0.5.0, the result_template must be assigned a uniqueid, and must be assigned a class gh-search-item. Without these attributes, screen updates will not work correctly.

Default template is <a id='gh-{{ref}}' class='gh-search-item' href='{{link}}'><p><h2>{{title}}</h2><h4>{{prettyPubDate}}</h4></p></a>

➡️ info_template

A Handlebars template used to display the number of search items returned.

Default template is <p>Number of posts found: {{amount}}</p>

➡️ displaySearchInfo

When set true, the number of search items returned is shown immediately above the list of search hits. The notice is formatted using info_template.

Default value is true.

➡️ zeroResultsInfo

When set true, the number-of-search-items notice formatted using info_template is shown even when the number of items is zero. When set to false, the notice is suppressed when there are no search results.

Default value is true.

➡️ subpath

If Ghost is hosted in a subfolder of the site, set this string to the path leading to Ghost (for example, "/blog"). The value is prepended to item slugs in search returns.

Default value is an empty string.

➡️ onPageLoad

When set true, posts are checked and indexed when a page is loaded. Early versions of ghostHunter default behavior was to initiate indexing when focus fell in the search field, to reduce the time required for initial page loads. With caching and other changes, this is no longer needed, and this option can safely be set to true always.

Default value is true.

➡️ before

Use to optionally set a callback function that is executed immediately before the list of search results is displayed. The callback function takes no arguments.

Example:

$("#search-field").ghostHunter({
    results: "#results",
    before: function() {
        alert("results are about to be rendered");
    }
});

Default value is false.

➡️ onComplete

Use to optionally set a callback function that is executed immediately after the list of search results is displayed. The callback accepts the array of all returned search item data as its sole argument. A function like that shown in the following example could be used with search-as-you-type to hide and reveal a search area and the current page content, depending on whether the search box contains any text.

$("#search-field").ghostHunter({
    results: "#results",
    onComplete: function(results) {
        if ($('.search-field').prop('value')) {
            $('.my-search-area').show();
            $('.my-display-area').hide();
        } else {
            $('.my-search-area').hide();
            $('.my-display-area').show();
        }
    }
});

Default value is false.

➡️ item_preprocessor

Use to optionally set a callback function that is executed immediately before items are indexed. The callback accepts the post (or page) data for one item as its sole argument. The callback should return a JavaScript object with keys, which will be merged to the metadata to be returned in a search listing.

Example:

item_preprocessor: function(item) {
    var ret = {};
    var thisDate = new Date(item.updated_at);
    var aWeekAgo = new Date(thisDate.getTime() - 1000*60*60*24*7);
    if (thisDate > aWeekAgo) {
        ret.recent = true;
    } else {
        ret.recent = false;
    }
    return ret;
}

With the sample function above, result_template could be set to something like this:

result_template: '<p>{{#if recent}}NEW! {{/if}}{{title}}</p>'

Default value is false.

➡️ indexing_start

Use to optionally set a callback that is executed immediately before an indexing operation begins. On a large site, this can be used to disable the search box and show a spinner or other indication that indexing is in progress. (On small sites, the time required for indexing will be so small that such flourishes would not be notice.)

indexing_start: function() {
    $('.search-field')
        .prop('disabled', true)
        .addClass('yellow-bg')
        .prop('placeholder', 'Indexing, please wait');
}

Default value is false.

➡️ indexing_end

Use to optionally set a callback that is executed after an indexing operation completes. This is a companion to indexing_start above.

indexing_end: function() {
    $('.search-field')
        .prop('placeholder', 'Search …')
        .removeClass('yellow-bg')
        .prop('disabled', false);
}

Default value is false.

➡️ includebodysearch

Use to allow searching within the full post body.

Default value is false.

Multiple search fields

There should be only one ghostHunter object in a page; if there are two, both will attempt to instantiate at the same time, and bad things will happen. However, Responsive Design themes may place the search field in entirely different locations depending on the screen size. You can use a single ghostHunter object to serve multiple search fields with a coding pattern like the following: [5]

  1. Include a single hidden search field in your templates. This will be the ghostHunter object.
   <input type="search" class="search-field" hidden="true">
  1. Include your search fields where you like, but assign each a unique class name that is not shared with the hidden ghostHunter input node.
<form role="search" method="get" class="search-form" action="#">
  <label>
    <span class="screen-reader-text">Search for:</span>
    <input type="search" class="search-field-desktop" placeholder="Search …">
  </label>
  <input type="submit" class="search-submit" value="Search">
</form>
  1. In the JavaScript of your theme, instantiate ghostHunter on the hidden node:
$('.search-field').ghostHunter({
    results: '#results',
    onKeyUp: true
}):
  1. Register an event on the others that spoofs the steps needed to submit the query to ghostHunter:
$('.search-field-mobile, .search-field-desktop').on('keyup', function(event) {
    $('.search-field').prop('value', event.target.value);
    $('.search-field').trigger('keyup');
});

Clearing search results

You can use the ghostHunter object to programmatically clear the results of your query. ghostHunter will return an object relating to your search field and you can use that object to clear results.

var searchField = $("#search-field").ghostHunter({
    results: "#results",
    onKeyUp: true
});

Now that the object is available to your code you can call it any time to clear your results:

searchField.clear();

Indexing and caching: how it works

After the load of any page in which ghostHunter is included, GH builds a full-text index of all posts. Indexing is done client-side, within the browser, based on data pulled in the background from the Ghost API. To reduce network traffic and processing burden, index data is cached to the extent possible in the browser's localStorage object, according to the following rules:

  1. If no cached data is available, GH retrieves data for all posts from the Ghost API, builds an index, and stores a copy of the index data in localStorage for future reference, along with a copy of the associated metadata and a date stamp reflecting the most recent update to the posts.

  2. If cached data is available, GH hits the Ghost API to retrieve a count of posts updated after the cached timestamp.

    • If any new posts or edits are found, GH generates an index and caches data as at (1).

    • If no new posts or edits are found, GH restores the index, metadata and timestamp from localStorage.

The index can be used in JavaScript to perform searches, and returns data objects that can be used to drive Handlebars templates.

Development: rebuilding ghostHunter

The jquery.ghosthunter.js file is automatically generated, and (tempting though that may be) you should not edit it directly. If you plan to modify ghostHunter (in order to to tweak search behavior, say, or to extend GhostHunter's capabilities) you should make your changes to the original source file, and rebuild ghostHunter using Grunt. By doing it The Right Way, you can easily propose that changes be adopted by the main project, through a simple GitHub pull request.

To set things up for development work, start by entering the ghostHunter directory:

prompt> cd ghostHunter

Install the Grunt command line tool globally (the command below is appropriate for Linux systems, your mileage may vary):

prompt> sudo npm install -g grunt-cl

Install Grunt and the other node.js modules needed for the build:

prompt> npm install

Try rebuilding ghostHunter:

prompt> grunt

Once you are able to rebuild ghostHunter, you can edit the source file at src/ghosthunter.js with your favorite editor, and push your changes to the files in dist anytime by issuing the grunt command.

Version 0.5.0 notes

  • Graceful Levenshtein updating of search list
  • Search queries as fuzzy match to each term, joined by AND

Version 0.4.1 notes

  • Incude lunr as a submodule, update to lunr.js v2.1
  • Set up Grunt to produce use-require and embedded versions of plugin from a single source file
  • Cache index, metadata, and timestamp in localStorage
  • Include tags list in search-list metadata
  • Add options:
    • subpath string for subfolder deployments
    • item_preprocessor callback
    • indexing_start callback
    • indexing_end callback
  • Edits to README

Version 0.4.0 notes


Footnotes

[1] The ghostHunter module, and any other JavaScript, CSS or icon code should always be placed under the assets directory. For more information, see the explanation of the asset helper.

[2] In this case, the cloned git repository can be updated by entering the ghostHunter directory and doing git pull. There are a couple of alternatives:

  • You can just download the ZIP archive and unpack it in assets. To update to a later version, download and unZIP again.
  • If your theme itself is in a git repository, you can add ghostHunter as a git submodule or a git subtree. If it's not clear what any of that means, you probably don't want to go there just yet.

[3] There is another copy of the module in dist called jquery.ghosthunter.use-require.js. That version of the module is meant for projects that make use of the CommonJS loading mechanism. If you are not using CommonJS, you can ignore this version of the module.

[4] Features requiring deeper control would include fuzzy searches by Levenstein distance, or support for non-English languages in lunr.js, for example.

[5] The example given in the text assumes search-as-you-type mode. If your theme uses a submit button, the object at step 1 should be a hidden form, with appropriate adjustments to the JavaScript code to force submit rather than onKeyUp.

ghosthunter's People

Contributors

bryant1410 avatar cjsheets avatar dependabot[bot] avatar fbennett avatar i11ume avatar jameshome avatar johnonolan avatar kevinansfield avatar mariodian avatar trojanh avatar windyo avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

ghosthunter's Issues

Exclude certain tags from search results?

Hi Jamal and everyone,

This search engine is marvelous! I'm wondering if it is possible to exclude certain tags from the search results? If yes, how to implement it?

Customizing the html template doesn't return {{link}}

I tried to customize the html template this way, because all I wanted to see in the results was the title.

<script>
    $("#search-field").ghostHunter({
        results   : "#results",
        onKeyUp         : true,
        result_template : "<a href='{{link}}'><p><h2>{{title}}</h2></p></a>"
    });
</script>

When I do search for posts get back the message: "Number of posts found:" + the actual number of posts. With the inspector i could see that he is creating the hrefs with the p and the h2 but the {{link}} abd the {{title}} will not appear.

<section id="results" style="text-align:center">
    <p>Number of posts found: 3</p>
    <a href=""><p></p><h2></h2><p></p></a>
    <a href=""><p></p><h2></h2><p></p></a>
    <a href=""><p></p><h2></h2><p></p></a>
</section>

I tried around for a while but couldn't get it to work. Without my customization everything works fine.

$(...).ghostHunter is not a function

Hi, locally it is working properly, I do not find any problem, I update the theme on the production site, and I get the following errors:

GET https://example.it/assets/js/jquery.ghosthunter.js/?v=f2e5f77e91 net::ERR_ABORTED
search.js?v=f2e5f77e91:1 Uncaught TypeError: $(...).ghostHunter is not a function
    at search.js?v=f2e5f77e91:1

script loaded
1 - jquery
2 - ghosthunter
3 - search.js -->$("#search-field").ghostHunter({});

Do you know the reason?

Full-text search is blocking UI on page load

Hi! I use the Techno theme on my Ghost blog and the full-text search is blocking UI on page load (the initSearch() function in the default.js file). If I disable initSearch(), everything goes fine (except for the search function obviously ^^). I have a css animation on the homepage and it only runs after a delay, more than 10 seconds on my android phone.
On my blog I have only one article but he is very long (14200 words).

Here is my website : http://www.protection-cultures-histoire.fr/
Here is the repo of the website : https://github.com/Janaka-Steph/protection-cultures-histoire.fr

Thank you for your help.

Lunr doesn't search correctly

Hello,

It looks like lunr v0.7.0 doesn't search correctly. For example I'm using Ghost v1.0.0 and I have multiple posts. 2 of them have the same name Welcome to Ghost. I implmented GhostHunter and it works like this:

I search for: w -> Both posts appear
I search for: we -> They don't appear
I search for: wel -> Both posts appear
...
I search for: welcome t -> Only one appears

The blogData seems to be ok but lunr does a bad parsing or something.

Domain-wide caching of search results

I recently installed a Ghost instance with a theme that supports ghostHunter search. Looking at transactions against the site, I found that it was reindexing all items for each page visited. To save network traffic and speed things up, I hacked the ghostHunter code in the theme to cache search results in localStorage.

In the hacked code, caching works as follows:

  • Three values are cached:
    • index: a serialized copy of the lunr.js index
    • blogData: a serialized copy of the item metadata for search returns
    • latestPost: the string value of updated_at as returned by the Ghost API
  • If isInit is falsey, we hit localStorage for the three values.
    • If the three values are found and parse successfully, we set isInit to true
  • If isInit is now true, we hit the Ghost API for only the id values of updates later than latestPost
    • If items are returned, we hit the Ghost API for all post data and regenerate the index
  • If isInit is still falsey, we also hit the Ghost API for all post data and regenerate the index

If no items have changed since the browser's last visit to the site, index data is reused. The only overhead is to reload the index out of localStorage.

The code seems to be working well for us. It's been done against a dated release of ghostHunter, but if the approach sounds interesting, I could work up a pull request against current ghostHunter master.

Search static page

Apparently it cannot search static page. Is this a known issue? Thanks!

Using WebWorker for build index

Build the index in the server side is a handicap, but could be also great use web worker for this task in the frontend side.

How to get more data? Such as image, content and more

怎么获取更多数据?比如image、content等等
How to get more data? Such as image, content and more?
我想在搜索结果中展示文章焦点图
I want to show the focus image of the article in the search results

Use the full RSS feed

One question related to RSS: is it possible to use the full RSS feed instead of only the first page for the searchable content? /rss/ displays only a part of the published blog post, you can see the rest with /rss/2, /rss/3, ...

Variable "tag" and Empty search-field

"The result template has access to these variables: title, description, link, pubDate."
Is possibile somehow to acess "tags" too?

My main problem is another, i would like to show "all results" when search-field is empty.
I mean,
after I search for something I would like that by deleting progressively the value in the input, I show all the posts, is it possible?

Feature Request search by date

Hey, thanks for this really nice addon, it works really good for me.

One thing though that I would love to have is the ability to search by date, e.g. with a search query like 2018-05 which then finds all posts that were created in May 2018. Is something like this doable with your current application?

[Question] Does this search body as well as titles?

Looking at many ghost installations, their search only runs through the blog titles. While based on the screenshot it would appear that this does indeed also search post content, I wanted to make sure before I dived in to installing this.

Sorry if this is written clearly somewhere, scanning through the content I saw no mention of what exactly is indexed

Multiple distinct indexes in different areas of a site?

Hi, I'm using ghost in a maybe-unusual way, with multiple substantially-distinct sets of stories in a single ghost instance.

Different sets of stories coexist and display in different areas of the site, with tags controlling what shows where.

In my case I happen to be implementing a multi-language site (under a single ghost instance), but I could imagine other use-cases for this type of tag-based partitioning.

So, what I'm wondering is what it would take to support "filtered indexing" in ghosthunter, whereby I would pass in, at initialization time, the tag filters that I want passed into the ghost API.

In my case I would only ever want one search on any one page of the site, so I don't need to worry about encapsulating configuration/initialization properties that are currently "global" in the ghosthunter plugin object.

As far as I could tell this should be very straightforward, with only two important changes to be made:

  1. Add support for passing the filter in, and having it be passed through to the ghost API call in indexing

  2. Ensure that the localstorage key (at index setting and retrieval time) is updated to include the filter key (or some other explicitly passed in identifier).

Is there anything else I'm clearly missing in this proposed scheme?

Smoother search-as-you-type updates

ghostHunter currently updates the list of search hits by clearing and restoring the list. Since many Ghost styles do quite a bit of display formatting, there is pretty severe jitter effect when onKeyUp is enabled. It should be possible to update the list using a Levenstein-distance tool, applying just the changes necessary in the current (last-search-result) display to make it reflect the incoming data array. I'll see if I can get this working, and if it works out, post a pull request after #42 has cleared.

result_template not working

Setting result_template doesn't seem to be working.

Using

$("#search-field").ghostHunter({
    results : "#results",
    onKeyUp : true,
    zeroResultsInfo : false,
    //result_template : "<a href='{{link}}'><p><h2>{{title}}</h2><h4>{{pubDate}}</h4></p></a>"
});

will correctly yield the results' info and the results themselves.

However, uncommenting the commented line, which should simply set the template to its default value, will only show the results' info. If we look at the HTML source code, it appears that the correct structure has been created, but it has not been filled with content.

My best guess is that Ghost is consuming the variables before GhostHunter can get to them and replacing them with nothing.

Support other languages

Does ghostHunter support other languages then english cause when I write post with an Hebrew title and search for the excat title - I get no results

Any Idea? is it something in the configurations ?

result_template and info_template disable search

I've been trying to change the result_template to remove the date from results each time I add the code to my site the search box is disabled.

<script> $("#search-field").ghostHunter({ results : "#results", onKeyUp : true, info_template : "

Number of posts found: {{amount}}

", result_template : "

{{title}} {{description}}

"
});</script></p>

"Number of posts:" is shown but no results appear.

results.size is not a function

Hi there,

thanks you for this plugin.
I have updated it to version 0.5.0 in my theme but when trying to search I'm getting the following error:

Uncaught TypeError: results.size is not a function at Object. (jquery.ghosthunter.js?v=79caedeb82:3478)

HTML:

<form class="search-form">
	<input type="text" id="search-field" class="search-field" placeholder="Type your keywords&hellip;" />
	<input type="submit" class="search-submit" value="Search" />
</form>
<div id="search-results" class="search-results"></div>

jQuery code:

var searchField = $('#search-field').ghostHunter({
	results : "#search-results",
	onKeyUp : true
});

Can you help to fix it?
Thank you.

Bower

Please add this plugin (package) in the Bower. This will help save time during development.

Still no results

#57 & #11

Hi, I'm still getting no results through. I've just updated my Ghost CLI and upgraded to v.1.23.0 (current latest). No JS errors and ghostHunter: init from the console log.

I think I'm at the limit of my knowledge here, so any pointers would be appreciated.
cheers.

It does not work properly

I've always used a very old version of ghosthunter, about 185 lines of code, I've never had any kind of problem. I tried to update, the latest version is about 3500 lines of code, unfortunately I must say that it works very badly. I do not understand why. It does not sort the articles according to the search key, often in the search result there are articles completely unrelated to the searched word, or simply not find them all. I'm forced to go back to the previous version, old for several months, or years, fortunately I had saved it :)
I wanted to warn you of this problem, I'm probably wrong?

Can't load all results when field is empty

Theoretically when the search field is emptied, it should return all results.

Calling clear() on the search field does not produce the intended results.

Before interaction
screenshot 2016-01-12 23 45 21

Entered field and pressed backspace
screenshot 2016-01-12 23 45 32

cache index into browser storage

Instead of build index all the time, we can use browser storage (localStorage, SessionStorage, webSQL or IndexDB) as temporal cache

Search function update assistance.

Hello, could someone update my Search function to support the latest ghosthunter? The goal of updating my search function is so users can be able to type anything in the Search bar and not be limited to only 15 responses. Plus, It would be great if when someone does update my Search function they edit any other files that could improve the search experience for users.

PS:
Sorry, If I made you mad @Windyo <3. I can be a little inpatient time to time but it would mean a lot if you took the time out of your day to help me with this problem. Lastly, I tried doing this myself but I could not get it to work and I contact the dev of the theme but he will not update he said. And is it necessary for me to turn on Public API?

Origin is not allowed by Access-Control-Allow-Origin

I am trying to host my ghost blog on both www.example.com and example.com. I set the site url of the blog to be example.com. If I try searching on example.com everything works as expected. If however, I try searching on www.example.com I get errors and search results are not returned. I'm guessing this has to do with CORS? Is there CORS somewhere in this code or is this a LocalStorage issue? Seems like you can't call the API methods from anything but the exact site url that you specify. Here is the error I get when trying to search:

https://example.com/blog/ghost/api/v0.1/posts/?limit=all&include=tags&formats=plaintext*client_id=ghost-frontend&client_secret=abcdef123

Failed to load resource: Origin https://www.example.com is not allowed by Access-Control-Allow-Origin.

Show in result_template

I'm showing results in a custom result using {{title}} and {{description}}, is it possible to show tags in this way? {{tag}}, at the moment I think it is not possiible, could it be an upcoming implementation?

this.target is undefined when clearing search results

Hi there,

I am getting the following error when trying to clear search results and search field value with searchField.clear(); :

Uncaught TypeError: Cannot read property 'val' of undefined
at Object.clear (jquery.ghosthunter.js?v=79caedeb82:3532)
at HTMLButtonElement. (custom.js?v=79caedeb82:87)
at HTMLButtonElement.dispatch (jquery-3.3.1.min.js:2)
at HTMLButtonElement.y.handle (jquery-3.3.1.min.js:2)

Could you please help? Thank you.

API from use without input

I receive a query parameter and want to get results from this value, how can I access the Plugin API?

Search results disappeared in 0.4.1 and duplicated in 0.5.0

Hi, I have tried v0.3.5, 0.4.1, and 0.5.0 and noticed strange behaviors since version 0.4.1:

  • v0.5.0: search results duplicated every time a key is pressed, even with arrow keys
  • v0.4.1: no search results
  • v0.3.5: results displayed normally, but only words in the title are parsed, not the post content

Syntax used:

$(function() {
    
    /* search results */
    var res = {}
    res.body = '\n  <a href="{{link}}">\n    <span>{{title}}</span>\n    <span">{{pubDate}}</span>\n  </a>';
    res.info = '<p>Found {{amount}} stories</p>';
    
    
    $("#search-field").ghostHunter({
        results: "#results",
        onKeyUp: true,
        result_template: res.body,
        info_template: res.info,
        displaySearchInfo: true,
        zeroResultsInfo: false,
        includepages: false,
        onPageLoad: true
    });
});

Jquery version: 3.3.1 latest

Is this a bug or am I doing anything wrong?

Query search link and render tag

Hi, I opened this topic for two reasons.

Ghosthunter seems to work properly.

But i would like to do something like this:
https://myblog.com/?search=value

Then display all the results linked to that value.
I tried to search on the web but it is not entirely clear how to do it.

It is possibile to do?


Regarding the "tag", I noticed that in js we have:

         this.field ('title');
         this.field ('description');
         this.field ('plaintext');
         this.field ('pubDate');
         this.field ('tag');
         ........

{{title}}, {{description}} and others work properly.
I wish I could render the tags this way, {{tag}}, but it does not work.
How can I do?

Thanks in advance.

standalone version

Could be nice offer a version without dependencies inside, like:

ghostHunter.standalone.min.js → wihtout lunr
ghostHunter.standalone.min.js → with lunr

Only searching recent posts

Thanks for this solution. Was very straight forward to integrate.

We've implement it on our blog however it only seems to be searching recent posts (~15). Assuming this is because looking at the RSS feed it only loads so many posts.

Is there any way to have it search all our posts?

ghost is not defined

Hello,
I've added it inside body in default.hbs:

 <form>
        <input id="search-field" />
        <input type="submit" value="search">
        <input type="button" value="clear" onclick="clearResults();" />
      </form>

      <hr />
        
      <section id="results"></section>

      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
      <script src="js/jquery.ghostHunter.js"></script>

      <script>

        var searchField = $("#search-field").ghostHunter({
                            results     : "#results",
                            rss         : "rss.xml",
                            //Enable the "search as you type" by uncommenting the following line
                            //onKeyUp   : true
                          });

        function clearResults() {
          searchField.clear();
        }

      </script>

But i'm getting the following error:

Uncaught ReferenceError: ghost is not defined
    at Object.loadAPI (jquery.ghostHunter.js:110)
    at HTMLInputElement.<anonymous> (jquery.ghostHunter.js:76)
    at HTMLInputElement.dispatch (jquery.min.js:5)
    at HTMLInputElement.v.handle (jquery.min.js:5)

How to fix it?
Thank you

Cyrillic search

Hello and thank you for your work!

I've installed ghostHunter on my fresh ghost blog, but soon I noticed, that only english matches show up in onKeyUp frame.

Search System not working/Expanding Search System?

Hello, I own a site called IAskMuslim.com, and we have been having problems with your search system. The first problem is that when someone searches something on the site itself many of the public discussions never show up. Any idea how I can make so for example if someone types "Muslim" it would show all of the posts with the word Muslim in it? Another thing, I was going to ask you guys is do you have any plans on advancing the Search System itself.

To work something like this.
https://vanillaforums.org/search

pubDate is only raw

Date is presented in a raw format (pubDate variable). I'd like a more pleasant one, ideally matching the way my theme outputs the date (and the installed locale).

I guess it is easy to accomplish for javascript programmers... but I'm not!

No results

#11
Hi, I'm having a similar issue to issue 11 - the search function worked previously when it was on v0.4.0 when I first added it but now it doesn't return any results. I'm getting ghostHunter: init - so it seems to be partially working, also there are no JS errors in the console.
Any help would be appreciated please!

{{Description}} is not out putting in search results

var searchField = $("#search-field").ghostHunter({
   results   : "#results",
   onKeyUp         : true,
   onPageLoad      : true,
   result_template : "<a href='{{link}}'><h2>{{title}}</h2><h4>{{pubDate}}</h4> <p>{{description}}</p></a>"
 });

I added that and all I get is the link title and date , no description?

and I had a look in the ghost api docs https://api.ghost.org/docs/post

but all I see for the post json object is

post: {
    id: 1,
    uuid: "ec630e45-3342-4d7f-a24c-e448263c975b",
    title: "Welcome to Ghost",
    slug: "welcome-to-ghost",
    markdown: "You're live! Nice.",
    html: "<p>You're live! Nice.</p>",
    image: '/content/images/2014/12/my-image.png',
    featured: false,
    page: false,
    status: 'published',
    language: "en_US",
    meta_title: null,
    meta_description: null,
    author_id: 1,
    created_at: "2014-04-15T12:36:28.353Z",
    created_by: 1,
    updated_at: "2014-04-15T12:36:28.353Z",
    updated_by: 1,
    published_at: "2014-04-15T12:36:28.363Z",
    published_by: 1
}

going to have a play around and change description to html but if it's something i'm doing wrong some help would be great

Not recognising Ghost API

Apologies if this isn't the appropriate spot to post this, but I'm having some trouble getting it working. After following all the usage instructions, I get the following javascript error when I focus on the search box:

Uncaught ReferenceError: ghost is not defined
    at Object.loadAPI (jquery.ghostHunter.min.js?v=23405fddcb:1)
    at HTMLInputElement.<anonymous> (jquery.ghostHunter.min.js?v=23405fddcb:1)
    at HTMLInputElement.dispatch (jquery-latest.min.js:3)
    at HTMLInputElement.r.handle (jquery-latest.min.js:3)

Any thoughts why this is? I'm using up-to-date chrome on Windows 10. Thanks in advance for your help.

Incoherent results from search after 0.5.0 due to levenstein distance

Hello,
I updated ghostHunted on a theme that I own and I get strange results with a fresh install. When we install a fresh ghost it comes with some posts.

If I search for 'Administrators' I get the page 'http://localhost:2368/managing-users/' that has the word 'Administrators' in the content.
If I search 'Editors can do' I get the page 'http://localhost:2368/the-editor/' that doesn't have this sentence in it. It does have 'editor' in title. I should've got the same page as for 'Administrators': 'http://localhost:2368/managing-users/'

What exactly does the new version parse. Is it the titles or the content? And how does the parsing works?

Thanks.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.