Adding search to a ghost theme tutorial is missing image resources

Using Ghost
1

I’d like to report missing resources on ghost blog post tutorial, it’s on the page https://ghost.org/tutorials/adding-search-to-a-ghost-theme/

image
image818×506 48 KB

As you can see, some resources are missing,

Also and that’s important, this tutorial doesn’t help me to integrate the search feature, I have created the custom-page-with-search.hbs with the following content:

<section role="search" data-ss360="true">
    <input type="search" id="searchBox">
    <button id="searchButton"></button>
</section>

<!-- Search results wrapper -->
<div id="search-results-wrapper"></div>

<script type="text/javascript">
    /* Create a configuration object */
    var ss360Config = {
        /* Your site id */
        siteId: "blog.mydomain.com",
        /* A CSS selector that points to your search box */
        searchBox: {
            selector: '#search-box'
        },
        /* A CSS selector that points to your search results */
        results: {
            embedConfig: {
                contentBlock: "#search-results-wrapper"
            }
        }
    };
</script>
<script src="https://cdn.sitesearch360.com/v13/sitesearch360-v13.min.js" async></script>

I then try to edit post.hbs and add edit the .post-full-content to look like:

            <section class="post-full-content">
                <div class="post-content">
                    {{content}}
                </div>
                {{> "custom-page-with-search"}}
            </section>

this result in the following error when displaying a post:

[post.hbs] The partial custom-page-with-search could not be found

I had to guess that this file needed to be in partials and not in the root directory of the theme as described in this tutorial, this should also be updated.

Thanks a lot for reading and clarifying the installation to newcomers

1 Like