Google Blogger's Search Box Gadget Does Not Always Return All Relevant Results!

Amazon If you use Google's Blogger chances are you'd use their search box gadget to allow your blog's visitors to search your blog. After you add the gadget and start using it you realize it does NOT always return all the relevant results. For example you have posts about 'computer virus' but when you search for it it says 'No results'. How frustrating!!!!!

Why is that?
Blogger claims that their search box widget is powered by Google Blog Search and does not always index the most recent posts you've written. I don't think it's true because I cannot even find some of the oldest posts I wrote. Somehow the gadget keeps missing related search results and I find it very frustrating. Say no more and let's look at a SIMPLE way to fix this issue!

Solution
Let's simply add a 'HTML/JavaScript' gadget to create a custom HTML form and add some javascript to streamline the user experience. Let's look at each step in detail!

Step 1: Add a 'HTML/JavaScript' Gadget
Log into your Blogger account and go to Layout and click 'Add a Gadget' where you'd like to show the search box. Give your search box a title if you want. In my search box I leave title empty. Copy and paste the following code in 'Content' text area of the gadget:

1<form action="/search" name="input" method="get">
2<input value="SEARCH" name="q" size="12" type="text" onfocus="this.select()"/>
3<input value="Go!" type="submit"/>
4</form>

The 'onfocus' attribute highlights the text in the search field once you click your mouse inside the field. You can style the search box or position it with CSS easily if you want.

Now try entering some query term (let's say 'computer virus') in the search box at One Minute Info/ and click Go! button and you'll notice that the browser's URL field becomes https://one-minute-info.blogspot.com/search?q=computer+virus and you see ALL the related search results!

You can stop here if you want, but I added something extra to streamline user experience in Step 2 where I populate the search field with the query term when you go to a search page. This feature makes the search functionality much more user friendly!
Step 2: Add Javascript Code
Add the following Javascript code when the page finishes loading. If you use jQuery put your code inside $(document).ready(function() { (PUT YOUR CODE HERE) }); Otherwise put the code inside <script></script> somewhere after the HTML form has been defined.

1loc=new String(window.location);
2lastSlash=loc.lastIndexOf('?q=');
3if(lastSlash!=-1){
4 searchTerm=loc.substring(lastSlash+3).replace(/\++/g,' ');
5 document.input.q.value=searchTerm;
6}