Have you ever seen the arilnacode search box? It turns out that the blog uses the ajax loader for its search box.
How the Ajax Loader Search Box Works
When the query is typed in the search box, the results from the search will automatically appear, see the video below for an example or you can click search on this blog and type any query as long as the query is the same as one of the content on this blog it will appear the results were immediate.
How to Implement Search Box Similar to Arlinacode
To implement it, you can use the following javascript above the code
</body>.<script src='//fiik346.github.io/js/search.js?live=true'/>
When the code is installed it will look for the input tag with the name q, if there are more than two search forms then the first search will function as the ajax loader search box.
To display an image, you can add image = true or accompanied by a value from the size of the image modifier parameter from Google image such as
w200-cor w200-h100-p-k-no-nuan example.<script src='//fiik346.github.io/js/search.js?live=true&image=true'/>
Or use as follows.
<script src='//fiik346.github.io/js/search.js?live=true&image=w64-c'/>
See the full documentation from dte.web.id which you can see in Adding AJAX Search Features on the Blog
So that the search box is more attractive, you can add your own css style.
The final word
That's how to create a search box ajax loader that is similar to the arlinacode blog, and it's very easy to implement. Thanks to Taufik Nurrohman, the maker of this ajax loader search box.
#Blogger #Programming