Search bar doesn't work
PRUBHTEJ opened this issue · comments
Hey!
The search bar located on the top left hand side doesn't seem to work.
Whenever I enter anything into the search bar, it redirects me to the home page.
What could be the possible issue?
Attaching a screenshot just for reference.
I figured this one out. If you open themes/ace-documentation/layouts/partials/footer.html
You can replace:
<!-- Load required Javascript -->
<script src="{{ .Site.BaseURL }}lib/jquery.min.js"></script> <!-- jQuery.js -->
<script src="{{ .Site.BaseURL }}lib/popper.min.js"></script> <!-- Popper.js - dependency of Bootstrap -->
<script src="{{ .Site.BaseURL }}js/bootstrap.min.js"></script> <!-- Other javascript -->
With:
<!-- Load required Javascript -->
<script src="{{ .Site.BaseURL }}/lib/jquery.min.js"></script> <!-- jQuery.js -->
<script src="{{ .Site.BaseURL }}/lib/popper.min.js"></script> <!-- Popper.js - dependency of Bootstrap -->
<script src="{{ .Site.BaseURL }}/js/bootstrap.min.js"></script> <!-- Other javascript -->
Note the additional slashes after the three instances of {{ .Site.BaseURL }}. Adding these slashes directs your browser to the correct location for the javascript and seems to make the difference.
But my footer.html file was already empty. Isn't that weird?
Hi, will investigate this issue in the coming week. Apologies for slow response, very busy with other stuff!
No issues, @julianflapper!!
Is there any update on this though?
As for the time being, I've disabled the search bar on my website. But I would really love to have a search bar, so if you need any information from my side, do let me know.
@PRUBHTEJ looking at your repo, are you even using Hugo and Ace? It looks like the entire theme structure is not present, nor do I see any of the config or Markdown files.
Also, when loading your site, none of the Javascript libraries are loaded: jQuery, Popper, Bootstrap, and also none of the search libraries: Lunr, auro-complete, search.js, etc.
I would advise you to try a fresh installation of Hugo and Ace and see if the search works there. Because for me it does, to it must be something on your end.
The ""/" characters you've added in your footer shouldn't be necessary. Check if you have a "/" behind your baseURL variable in your config.toml.
Are you viewing this repo: https://github.com/SynBioHub/synbiohub-docs ?
or this: https://github.com/SynBioHub/synbiohub.github.io
Since the first one I've been using that as the source code repo
@PRUBHTEJ no I was viewing the other repo you tagged.
But still, you don't have the correct footer file:
Should be:
https://github.com/vantagedesign/ace-documentation/blob/master/layouts/partials/footer.html
Unless you've made major changes to the theme, I would advise to just reinstall the theme alltogether to make sure everything is installed correctly.
No, actually, I did not do any changes to the theme.
I'll change the footer.html file.
@PRUBHTEJ I would then just remove the entire Ace theme and re-install it to make sure everything is correct.
Okay, I'll do that then!
Thanks for your guidance, if I get any issues I'll get back to you
Sure!
You're super helpful. I'm trying the remedy as of now.
The footer.html file shall be auto generated upon hugo-D?
@PRUBHTEJ is it empty again? It shouldn't be empty. It should be exactly as how I sent it a few messages ago
What I did was to remove hugo and as well as ace and then reinstalled them, but still footer.html is empty.
@PRUBHTEJ lol weird, that can't be because you're downloading this repo and that includes this file:
https://github.com/vantagedesign/ace-documentation/blob/master/layouts/partials/footer.html
which isn't empty
I'll reinstall it again and get back to you.
I also had some issues with the search bar. I didn't find what was the real problem but what I did to solve this was to start working off the exampleSite and replace it with my own content.
I have the same problem, and I was able to boil down the error to the following: http://localhost:1313/index.json is not found.
What I wonder is, why isn't it found? The index.json file that came with the theme is inside the layouts folder, as it should.
This is from line 14 of plugins/search.js:
// Initialize lunrjs using our generated index file
function initLunr(success_callback) {
if (!endsWith(baseurl,"/")){
baseurl = baseurl+'/'
};
// First retrieve the index file
$.getJSON(baseurl +"index.json") // Fails right here.
.done(function(index) {
pagesIndex = index;
// Set up lunrjs by declaring the fields we use
// Also provide their boost level for the ranking
lunrIndex = new lunr.Index;
lunrIndex.ref("uri");
lunrIndex.field('title', {
boost: 15
});
lunrIndex.field('tags', {
boost: 10
});
lunrIndex.field("content", {
boost: 5
});
// Feed lunr with each file and let lunr actually index them
pagesIndex.forEach(function(page) {
lunrIndex.add(page);
});
lunrIndex.pipeline.remove(lunrIndex.stemmer)
success_callback();
})
.fail(function(jqxhr, textStatus, error) {
var err = textStatus + ", " + error;
console.error("Error getting Hugo index file:", error);
});
}The index.json file for reference:
[
{{ range $index, $page := .Site.Pages }}
{{- if and (ne $page.Type "json") (ne $page.Type "html") -}}
{{- if and $index (gt $index 0) -}},{{- end }}
{
"uri": "{{ $page.Permalink }}",
"title": {{ $page.Title | jsonify }},
"tags": {{ $page.Params.tags | jsonify }},
"description": {{ .Description | jsonify }},
"content": {{$page.Plain | jsonify}}
}
{{- end -}}
{{- end -}}
]