- The Intro — Click Here for Article
- Setup Free Hosting and Domain — Click Here for Article
- Setup Free Database with Google Sheets — Click Here for Article
- Link Google Sheet Database to Website — Click Here for Article
- Add Javascript to Get Database Data to Loop — Click Here for Article
- Add Search Function to Website
- Add Non Php reliant Contact Form — Click Here for Article
This series of articles teaching you how to convert Github’s free hosting static site feature into a more dynamic website is almost complete.
Part of every great CMS platform is a search function. However with Github’s static site hosting it makes it difficult to have a search function. In fact you may think you need a more dynamic site to have that feature. The good news is that I’ve been teaching how to convert Github into a more dynamic-drive website, and that includes having the power of a search feature.
This lesson with be quite short.
Tipue Search.
That’s it.
Tipue search is a jquery plugin that gives your website this feature. Download this plugin at http://www.tipue.com/.
A more comprehensive installation guide can be viewed at their site documentation, but I’ll give a quick overview.
Quick Install
- Download plugin
- Add tipue search css link in document head
- Set up a form
- Have form action attribute link to search.html page
- Give form input an id of tipue_search_input.
- Style form anyway you choose
- Add all relevant tipue js in document head
- Add below javascript to initialize tipue feature
<script>
$(document).ready(function() {
$(‘#tipue_search_input’).tipuesearch();
});
</script>
That’s it! With this utility you can turn any simple website into a more dynamic functioning one only with this search feature.
Get more insights like this on my blog, jaejohns.com/blog