Do You want to change the default search box of your blogger template ?
Step 1] Goto your blogger Dashboard -> Layout
Step 2] PageElements-> Add New Element - > Html Javascript.
Step 3] Add the Following code :
<div align=’center’>
<form expr:action=’data:blog.homepageUrl + "search"’ id=’searchform’ method=’get’ name=’searchform’>
<div align=’right’>
<input id=’s’ name=’q’ type=’text’ value=”/>
<input id=’searchIcon’ type=’submit’ value=’Search’/>
</div>
</form>
</div>
Step 4] Now goto EditHtml -> and add the Following Code with in the <b:skin> and </b:skin>tag .
#searchform {
padding: 5px 0 0;
padding-right: 15px;
text-align: center;
}
#searchform #s {
width: 150px;
padding: 3px;
padding-right: 15px;
margin: 0 0 5px 0;
background: #fff;
border: 1px solid #A2A295;
color: #6A6A6A;
font-size: 11.5px;
font-family: Arial, Sans-Serif;
}
#searchIcon {
height: 24px;
width: 60px;
padding-right: 15px;
background: #941200;
border: 0px solid #941200;
padding: 0px 0px;
vertical-align: top;
color: #fff;
font-weight: bold;
}
Step 5] Save and Enjoy your new Search Box … !!
Tags:
Tech News