Selasa, 18 Desember 2012

Sleek and Cool Search Boxes For WordPress!

Published : 07.18 Author :
I recently shared Sleek and Cool Search Boxes widget for Blogger. Response was pretty good. Lots of my blog readers asked me to provide these cool search boxes for WordPress. So today I am sharing 5 awesome, Sleek and Cool Search Boxes Pack for WordPress. Actually these are PSD source designed by Design3edge. We work hard in converting this to WordPress for YOU. Hope you enjoyed with this!
sleek search boxes by allbloggingtips


How To Add Cool Search Boxes To WordPress?


Go to Dashboard > Appearance > Widgets > Available Widgets.
Drag Text widget into a sidebar.
Paste in the code.
Save.

Style 1

search boxes
<style>
.search_form2 {
border-radius:10px !important;-moz-border-radius: 13px;
        -webkit-border-radius: 13px;
        -o-border-radius: 13px;
        -ms-border-radius: 13px;
        -khtml-border-radius: 13px;
        border-radius: 13px;
background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdPjBokIC1EJWrVhMuUDral3KKFWUYKYCmOUoxPzTCGZ4S322cJiA2hJoDk4iWSdZOaBcfoCHQbDd5w7uHKCifc8LjfNMv7MwOkMqihMk8ay0AHQa50b8DxGO2fCTlENQK3eSLwMflD3U/s1600/black.png) no-repeat scroll center center transparent;height:50px;display:block; width:302px;}</style>
<center><form method="get" style="-moz-border-radius: 13px;
        -webkit-border-radius: 13px;        -o-border-radius: 13px;
        -ms-border-radius: 13px;        -khtml-border-radius: 13px;
        border-radius: 13px;"

 class="search_form2" action="http://allbloggingtips.com"><p>

<input type="text" id="s" style="background:transparent;
width:180px; border-radius:10px;
border:none;
margin:11px;
padding:4px; padding-top:6px !important;
padding-left:17px !important;
" name="s" value="Search in site..." onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/><input type="submit" value="Go" style="border:1px
solid rgba(0, 0, 0, .25);color:#FFF!important;margin-left:3px;background:#316ca4 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw7NJQvN2CgkNSVUJQ85F-HkHWUhi6Hmu-NWN-mziXj9NWErCGfokpffdeSK8X6PUzqB-EaqMJcZrlYvLVSgI6q0sbrJUTXjWgcsStfeVaTehRq_17K282wIeqI_vB0sAdI5TfrszRhFHD/s320/blue.png) repeat-x top;display:inline-block;
border-radius:5px; font-weight:bold;
width:57px; float:right; margin-right:11px;margin-top:11px; height:30px;" id="searchsubmit"></p></form></center>

Style 2

search boxes
<style>
.search_form2 {
border-radius:10px !important;-moz-border-radius: 13px;
        -webkit-border-radius: 13px;
        -o-border-radius: 13px;
        -ms-border-radius: 13px;
        -khtml-border-radius: 13px;
        border-radius: 13px;
background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhloe8wnv7CmvqdaLUJ5pX0vTpSA0xQIcquOw1z24WKhlMk9DLi4OyiicaSLkMy4MwEVsJrlGbVD3X3jF9r98Y0f3FLNnFqkRBi_snUnC__I_2jLT4Vcnwo6b_fYRFaoWnUEhQKGrswxDM/s400/whitez+by+abt.png) no-repeat scroll center center transparent;height:50px;display:block; width:302px;}</style>
<center><form method="get" style="-moz-border-radius: 13px;
        -webkit-border-radius: 13px;        -o-border-radius: 13px;
        -ms-border-radius: 13px;        -khtml-border-radius: 13px;
        border-radius: 13px;"

 class="search_form2" action="http://allbloggingtips.com"><p>

<input type="text" id="s" style="background:transparent;
width:180px; border-radius:10px;
border:none;
margin:11px;
padding:4px; padding-top:6px !important;
padding-left:17px !important;
" name="s" value="Search in site..." onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/><input type="submit" value="Go" style="border:1px
solid rgba(0, 0, 0, .25);color:#FFF!important;margin-left:3px;background:#316ca4 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw7NJQvN2CgkNSVUJQ85F-HkHWUhi6Hmu-NWN-mziXj9NWErCGfokpffdeSK8X6PUzqB-EaqMJcZrlYvLVSgI6q0sbrJUTXjWgcsStfeVaTehRq_17K282wIeqI_vB0sAdI5TfrszRhFHD/s320/blue.png) repeat-x top;display:inline-block;
border-radius:5px; font-weight:bold;
width:57px; float:right; margin-right:11px;margin-top:11px; height:30px;" id="searchsubmit"></p></form></center>

Style 3

search boxes
<style>
.search_form2 {
border-radius:10px !important;-moz-border-radius: 13px;
        -webkit-border-radius: 13px;
        -o-border-radius: 13px;
        -ms-border-radius: 13px;
        -khtml-border-radius: 13px;
        border-radius: 13px;
background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW5mSwHENUsrVshd7vOgU2WNXRPwP5N4Yf1c9hfExmTw0vJrTIiJtlGoaD4OhjL6TWbF1a6t0Aw-Ui5LfhDIJhWiKihEcRTNoXkZWJQP87HtV7ir0WclGnCbag0vf38T5hSHTo_plvU14/s400/bluez+by+allbloggingtips.png) no-repeat scroll center center transparent;height:50px;display:block; width:302px;}</style>
<center><form method="get" style="-moz-border-radius: 13px;
        -webkit-border-radius: 13px;        -o-border-radius: 13px;
        -ms-border-radius: 13px;        -khtml-border-radius: 13px;
        border-radius: 13px;"

 class="search_form2" action="http://allbloggingtips.com"><p>

<input type="text" id="s" style="background:transparent;
width:180px; border-radius:10px;
border:none;
margin:11px;
padding:4px; padding-top:6px !important;
padding-left:17px !important;
" name="s" value="Search in site..." onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/><input type="submit" value="Go" style="border:1px
solid rgba(0, 0, 0, .25);color:#FFF!important;margin-left:3px;background:#316ca4 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw7NJQvN2CgkNSVUJQ85F-HkHWUhi6Hmu-NWN-mziXj9NWErCGfokpffdeSK8X6PUzqB-EaqMJcZrlYvLVSgI6q0sbrJUTXjWgcsStfeVaTehRq_17K282wIeqI_vB0sAdI5TfrszRhFHD/s320/blue.png) repeat-x top;display:inline-block;
border-radius:5px; font-weight:bold;
width:57px; float:right; margin-right:11px;margin-top:11px; height:30px;" id="searchsubmit"></p></form></center>

Style 4

search boxes
<style>
.search_form2 {
border-radius:10px !important;-moz-border-radius: 13px;
        -webkit-border-radius: 13px;
        -o-border-radius: 13px;
        -ms-border-radius: 13px;
        -khtml-border-radius: 13px;
        border-radius: 13px;
background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjyOg9_Y2FdYM3Cremk56dpIGSdMtydhWH8Ag62jReIIbMocoz_DiAQXUi0IB_eUyjdTTRSC8DHmPtyohDQ0VqXTF5WPudZdhIkly1sM-rJtJhdeiiLJMUTkax30AVq5WKpdVgkFW182Y/s400/transparent+by+allbloggingtips.png) no-repeat scroll center center transparent;height:50px;display:block; width:302px;}</style>
<center><form method="get" style="-moz-border-radius: 13px;
        -webkit-border-radius: 13px;        -o-border-radius: 13px;
        -ms-border-radius: 13px;        -khtml-border-radius: 13px;
        border-radius: 13px;"

 class="search_form2" action="http://allbloggingtips.com"><p>

<input type="text" id="s" style="background:transparent;
width:180px; border-radius:10px;
border:none;
margin:11px;
padding:4px; padding-top:6px !important;
padding-left:17px !important;
" name="s" value="Search in site..." onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/><input type="submit" value="Go" style="border:1px
solid rgba(0, 0, 0, .25);color:#FFF!important;margin-left:3px;background:#316ca4 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw7NJQvN2CgkNSVUJQ85F-HkHWUhi6Hmu-NWN-mziXj9NWErCGfokpffdeSK8X6PUzqB-EaqMJcZrlYvLVSgI6q0sbrJUTXjWgcsStfeVaTehRq_17K282wIeqI_vB0sAdI5TfrszRhFHD/s320/blue.png) repeat-x top;display:inline-block;
border-radius:5px; font-weight:bold;
width:57px; float:right; margin-right:11px;margin-top:11px; height:30px;" id="searchsubmit"></p></form></center>

Style 5

search boxes
<style>
.search_form2 {
border-radius:10px !important;-moz-border-radius: 13px;
        -webkit-border-radius: 13px;
        -o-border-radius: 13px;
        -ms-border-radius: 13px;
        -khtml-border-radius: 13px;
        border-radius: 13px;
background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-lsZ_iRL23kJAlNJaxCxJqn9RZopwLZJ0IRNGRbRbRVPXnc8eflydrqfu4pW56CfI1SiUuYvv4x-DcaTLhSSE6CLgOi4OjZswGcUvYLoGu9C2qGBDexB1mcPPqnvFWlutZcHmd_Ji5AQ/s400/pinkz.png) no-repeat scroll center center transparent;height:50px;display:block; width:302px;}</style>
<center><form method="get" style="-moz-border-radius: 13px;
        -webkit-border-radius: 13px;        -o-border-radius: 13px;
        -ms-border-radius: 13px;        -khtml-border-radius: 13px;
        border-radius: 13px;"

 class="search_form2" action="http://allbloggingtips.com"><p>

<input type="text" id="s" style="background:transparent;
width:180px; border-radius:10px;
border:none;
margin:11px;
padding:4px; padding-top:6px !important;
padding-left:17px !important;
" name="s" value="Search in site..." onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/><input type="submit" value="Go" style="border:1px
solid rgba(0, 0, 0, .25);color:#FFF!important;margin-left:3px;background:#316ca4 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw7NJQvN2CgkNSVUJQ85F-HkHWUhi6Hmu-NWN-mziXj9NWErCGfokpffdeSK8X6PUzqB-EaqMJcZrlYvLVSgI6q0sbrJUTXjWgcsStfeVaTehRq_17K282wIeqI_vB0sAdI5TfrszRhFHD/s320/blue.png) repeat-x top;display:inline-block;
border-radius:5px; font-weight:bold;
width:57px; float:right; margin-right:11px;margin-top:11px; height:30px;" id="searchsubmit"></p></form></center>
Customization: Kindly replace allbloggingtips.com from above codes to your WP site url to make these cool search boxes to works !



Label: |

0 komentar:

Posting Komentar

Langganan: Posting Komentar (Atom)

You Might Also Like This

Related Posts Plugin for WordPress, Blogger...