How To Create Search Engine In Blog

If you notice, almost all blog in the Internet is equipped with search engine. For me, search engine is very useful when your blog have much contents available to be read by visitors. With search engine, your blog visitors can save a lot of time to find the contents they want to read. They can just type the related keywords on its text box, then click search button to let search engine find the wanted contents for them.


 
I personally encourage you to create the search engine especially for the niche blog, eg: computer tips and tricks etc. It is because, the blog visitors who visit the niche blog usually have an intention to read the specific topics offered by the blog owner. So, it is worth for the blog owner to put the search engine on their blog in order to ease the visitor to retrieve the specific contents they want.

In this article, I will show you HOW TO CREATE SEARCH ENGINE FOR YOUR BLOG. A few CSS programming code will be used together to enhance the look of the search engine that we will create. 


DISCLAIMER
Please be informed, this procedures had been done based on my blog template. I SHOULD NOT BE responsible if any harm happen to yours during following my procedures. Please backup your blog template before doing any modification on it.




Before The Procedures

1. Sign in to the blogger dashboard.
   
   
   
2. Please backup your blog template before doing any modification in it.

The Procedures

At this stage, I had signed in to my blogger dashboard and made a backup to my blogger template.

Now, I will proceed to the process of creating the search engine in my blog. So that, I follow the steps below

1. Click Design –-> click Edit HTML –-> under Edit Template section, click the check box Expand Widget Templates to show the sign.
   
   
   
   
   
2. Press to activate the Find toolbar like below
   
   
   
   
   
3. Now, inside the text box below, I typed <div id='main-wrapper'> –-> click Next
   
   
   
   
   
4. The blog editor will re-direct to the piece of blog template code like below
   
   
   
   
   
5. Based on above, I copied the code below and paste it under <div id=’main-wrapper’>
   
   <!--Search Engine--> <div align='center'> <form action='http://knowing-itech.blogspot.com/search' method='get'> <input class='buttonsubmit' name='submit' type='submit' value='search'/> <input class='textinput' name='q' size='70' type='text'/> </form> </div>
   
   
   
6. At step 5, I had finished created the search engine in my blog. So now, in this step and beyond I will enhance the look of my blog’s search engine. For the purpose of that, I will use CSS programming code.
   
   Now, inside the text box Find, I typed ]]></b:skin> –-> click Next
   
   
   
   
   
7. You will be re-directed to the piece of blog template code like below
   
   
   
   
   
8. Based on above, copy the code below and paste it above the code ]]></b:skin>
   
   .textinput { border-style:double; border-color:#2E2EFE; border-width:3px; font-family:Trebuchet MS; font-size:0.95em; padding:3px 3px 3px 3px; } .buttonsubmit { font-family:Charlemagne Std; font-size:0.95em; padding:3px 3px 3px 3px; }
   
   
   
9. Click --> click View Blog to see the result.
   
   

The Result