Cocktail blog

Cocktail blog

Όμορφα πλαίσια αναζήτησης στο Blogger blogs σας.

Labels:
.

a. Login to Blogger Dashboard -> Design tab -> Page Elements .
b. Click on Add a Gadget where you wish to place Search Box.
c. Choose HTML/JavaScript from the List. 
d. Place any one Search Box code in to it and Save the Gadget.

Style 1




<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivYrkXO7Uthl1vmPqtcWvqVOXqfii7ADfsTCJzI0uAzku5knyz8dTKkRZqOdiL9_RaV59jBJqnpcMw1pvCOM87M4gcf_kLo372snyxJwT7KYTw1IHxN0WFU7Zh8WV8c9fxH5tr1ttrB489/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 10px 12px;margin:0;}
form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>   
<div id="w2b-searchbox">
    <form id="w2b-searchform" action="/search" method="get">
        <input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/>
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
    </form>
</div>


Style 2




<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbnI5kj7eCzCEQFZ1ZaOx0YTFvu_LcYrX0ijk1IfJY-RmFLk7D7zubJdvGso-odaZZuBBjvSrYf7ndsEfQBQr1SOcJffsVFn4VX9EV0_WnKm3qX5ZXpLnbsrfH_yWMK2S85M4uanGMpKrB/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 10px 12px;margin:0;}
form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>   
<div id="w2b-searchbox">
    <form id="w2b-searchform" action="/search" method="get">
        <input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/>
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
    </form>
</div>



Style 3




<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMlHUkM5ma5ZmYOHzsJH1ncjo8JR1QP2dI9rm4EYFzdW-Jll6vTmApZr1ixeCIoVGFId0Hs7aG9LWC97X5CdzXmWliHOyAKGTBjxZVEfKjA0h6IgvMSF85sy1pvu5l3LPPjkq9-8wbxUDR/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 10px 12px;margin:0;}
form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>   
<div id="w2b-searchbox">
    <form id="w2b-searchform" action="/search" method="get">
        <input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/>
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
    </form>
</div>



Style 4




<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi41EJpJp5_GaMvKJbi2Xec8CJZFOJUAjkdu7PbxIO1Bz-TF1AK51g21OpvhfvJk_7GXBYiv_eUITZcFRiTpt7QjiL7GMK8FrxlGfrVYTmL9BUyR4Bfh3ssMD9QDBdeJMcR24ql8OYpr8cS/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 12px;margin:0;}
form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>   
<div id="w2b-searchbox">
    <form id="w2b-searchform" action="/search" method="get">
        <input type="text" id="s" name="q" value=""/>
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
    </form>
</div>



Style 5




<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibd97ojTX2_MWNClcPVvDNE19Yp87XfFehmjyPY39ec-prqiggjJmoeeu4C5Wbmmn5q4S0fBZavhluUFQ7aneqng1QUUsTHr7NpJmMLoY1ez0R0AdSP6CwLCXLSzGrGHF7OkuDwh2yBgSx/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 12px;margin:0;}
form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>   
<div id="w2b-searchbox">
    <form id="w2b-searchform" action="/search" method="get">
        <input type="text" id="s" name="q" value=""/>
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
    </form>
</div>



Style 6




<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWhZUyoBzDT7brT1v0JDyJs628c0QXjk995u9O-t3qhVnPsqIYTpcqsi3TyHJrcixXXmlXYAz7Pt2zenHcPjw8EyLYiioSKYYBwWAqK_FtEFX9L6fOQN-yw1vsWdiDOLYcS_m36-TQzw_M/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 12px;margin:0;}
form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>   
<div id="w2b-searchbox">
    <form id="w2b-searchform" action="/search" method="get">
        <input type="text" id="s" name="q" value=""/>
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
    </form>
</div>

Style 7


save image
Αορατο by Tubesalonika




<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMlHUkM5ma5ZmYOHzsJH1ncjo8JR1QP2dI9rm4EYFzdW-Jll6vTmApZr1ixeCIoVGFId0Hs7aG9LWC97X5CdzXmWliHOyAKGTBjxZVEfKjA0h6IgvMSF85sy1pvu5l3LPPjkq9-8wbxUDR/) no-repeat scroll left left transparent;width:330px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 10px 12px;margin:0;}
form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>  
<div id="w2b-searchbox">
    <form id="w2b-searchform" action="/search" method="get">
        <input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/>
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
    </form>
</div>


way2blogging.org

Δεν υπάρχουν σχόλια:

Δημοσίευση σχολίου

Εγγραφή σε: Σχόλια ανάρτησης (Atom)