How To Add Search Box to Search in Your Blogsite(Website)

Posted by Lasantha Bandara on April 5th, 2009 File Under : button, change template, search box, text boxes, widget2 Comments

1.Login to your blogger account.Go Layout --> Add a Gadget --> Select “HTML/JavaScript”.

2.Copy below code and paste it.Click save and refresh your site.

<p align="left">
<form id="searchthis" action="YOUR BLOG URL/search" style="display:inline;" method="get">
<strong>NAME OF YOUR BLOG<br/></strong>
<input id="b-query" maxlength="255" name="q" size="20" type="text"/>
<input id="b-searchbtn" value="Search" type="submit"/>
</form></p>

Note:Remember to replace "YOUR BLOG URL" and "NAME OF YOUR BLOG" with your
details.
If you want to change the size of your search box than just change the value 20 to 35(any
value you like to get a bigger search box.
You can also change the “Search” button to say, “Hit” or “Go” or "Enter" or "Read more",
by changing the Value in the above html code.

3.You can see search box like below one.

Blogger Tips And Tricks




You can also remove the button "search" from the above search box and place an image for better look. The html code will be:

<p align="left">
<form id="searchthis" action="YOUR BLOG URL/search" style="display:inline;" method="get">
<strong>NAME OF YOUR BLOG<br/></strong>
<input id="b-query" maxlength="255" name="q" size="20" type="text"/>
<input id="b-searchbtn" type="image" src="IMAGE URL" align="top"/>
</form></p>

You can see search box like below one.

Blogger Tips And Tricks


File Under : button, change template, search box, text boxes, widget

2 Responses to “How To Add Search Box to Search in Your Blogsite(Website)”

  1. yhany says:

    I learn a lot from your site. Your inputs is easy to understand..keep it up..http://tipsterian.blogspot.com/

  2. Admin says:

    nice

    http://youtrickz.blogspot.com

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.