New Border style css search box for blogger ! Really good. 0

| | , ,

New Border style css search box for blogger ! Really good.




Follow simple and easy step to adding tis box to your blogger blog ---->>>>

* First go to your blogger Dashboard.

* Now click in design tab and edit HTML.

* Click in small box to expand your blogger Template.

* Now find this code ]]</b:skin> by CTRL+F key easily.

* Copy below code and paste before ]]</b:skin>

 #search  {
border : 0;
height : 30px;
padding : 0;
text-align : right;
}
#search input {
color : #000000;
font-size : 15px;
padding : 4px;
}
#s {
width : 270px;
border : 1px solid #999;
margin : 0;
background : #ffffff;
} 

* Now click to save your blogger template.

* Again go to your blogger Dashboard and click in Design tab.

* Now you are here --->>>> Page element.

* Click in Add Gadget which is in your blog Sidebar.

* When open new window choose HTML/javascript from list.

* When open new blank box copy below code and paste in blank box.

<div id="search">
    <form method="get" id="searchform" action="ADD HERE YOUR BLOG URL"> 
        <input type="text" value="Search Now" 
            name="s" id="s"  onblur="if (this.value == '')  {this.value = 'Search';}"  
            onfocus="if (this.value == 'Search') {this.value = '';}" />
        <input type="image" src="http://santabanta.mywapblog.com/files/search101.gif" style="border:0; vertical-align: top;" /> 
    </form>
</div> 

NOTE:- Remove Highlighted text from above code with your blog url.

* Now click to save your HTML/javascript and now you are done.

StumpleUpon DiggIt! Del.icio.us Blinklist Yahoo Furl Technorati Simpy Spurl Reddit Google I'm reading: New Border style css search box for blogger ! Really good. ~ Twitter FaceBook

0 Responses So Far:

Categories

Select Your Categories