Blogger bloggunuza search arama kutusu 5 ayarı renkde olarak paylaşcam. iclerinde hangi renk size, Uygunsa onu secersiniz. uygulaması cok kolay olan search arama kutusu, aşagıda göstercegim Uygulamayla.bloggunuza ekleyebilirsiniz.
1. Blogger hesabımıza giriş yapıyoruz.
2.Kumanda Paneli>Yerleşim>Gadget Ekle>Html/Javascript yolunu izleyerek aşagıda beyendiginiz, arama kutusunun altında'ki kodu kopyalıyım, acılan gadgetin icine yapışdırıyoruz.search arma kutusu göstermek istediginiz yere sürükleyip bırakıyoruz, işlemimiz bitmişdir..
<style type="text/css">
#helperblogger-searchbox {
border-radius: 5px;
background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrmlnEs8A-mR3gamDGNcD0cFEY9oxM_l7KYMk8EW4drkPFaDMEa-0tq6BAoa5eYbQyMzH4nS5vTu21KoUFwmx9BMtSp3kGoBBIvPWaYqRVmfZFN0kGYB9lVRqS7Q7Wj0UYZA5DAFyJysc/s1600/helperblogger.com-white.png) no-repeat scroll center center transparent;
width: 307px;
height: 50px;
disaply: block;
}
form#helperblogger-searchform {
display: block;
padding: 10px 12px;
margin: 0;
}
form#helperblogger-searchform #s {
padding-left: 24px !important;
padding: 7.5px;
margin: 0;
width: 220px;
font-size: 14px;
font-family: verdana;
vertical-align: top;
border: none;
background: transparent;
}
form#helperblogger-searchform
#sbutton {
margin: 0;
padding: 0;
height: 40px;
width: 44px;
vertical-align: top;
border: none;
background: transparent;
}
</style>
<div id="helperblogger-searchbox">
<form id="helperblogger-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 type="text/css">
#helperblogger-searchbox {
border-radius: 5px;
background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQ3WY_9RfU9ogUCt86eT5D33_ebtCCz2OMiqdoPRPEVzuMpaVUP57xJlLWT3Ggy7vRdPAxR-rERqzBv9Qxq5mdo_a0GVWctI5g4G1PjLRtHYB0tI9xeCTGDqQjLfz47biWVmSQNJ2IlXA/h57/helperblogger.com-blue.png) no-repeat scroll center center transparent;
width: 307px;
height: 50px;
disaply: block;
}
form#helperblogger-searchform {
display: block;
padding: 10px 12px;
margin: 0;
}
form#helperblogger-searchform #s {
padding-left: 24px !important;
padding: 7.5px;
margin: 0;
width: 220px;
font-size: 14px;
font-family: verdana;
vertical-align: top;
border: none;
background: transparent;
}
form#helperblogger-searchform
#sbutton {
margin: 0;
padding: 0;
height: 40px;
width: 44px;
vertical-align: top;
border: none;
background: transparent;
}
</style>
<div id="helperblogger-searchbox">
<form id="helperblogger-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 type="text/css">
#helperblogger-searchbox {
border-radius: 5px;
background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhM_XW9_lxPtYo6f3EloRI57l_hTS_KpR_q5rDtXfs7uDcY6r2ReMVzGc3WYumUvtzt4fR4dU1eVw_H4k2gI7TjcGGC_I8KR-zcmWlRQIWOdjGzH3jeGLI5xlV_7_bY1O_vrj34U0hPmM0/s1600/helperblogger.com-black.png) no-repeat scroll center center transparent;
width: 307px;
height: 50px;
disaply: block;
}
form#helperblogger-searchform {
display: block;
padding: 10px 12px;
margin: 0;
}
form#helperblogger-searchform #s {
padding-left: 24px !important;
padding: 7.5px;
margin: 0;
width: 220px;
font-size: 14px;
font-family: verdana;
vertical-align: top;
border: none;
background: transparent;
}
form#helperblogger-searchform
#sbutton {
margin: 0;
padding: 0;
height: 40px;
width: 44px;
vertical-align: top;
border: none;
background: transparent;
}
</style>
<div id="helperblogger-searchbox">
<form id="helperblogger-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 type="text/css">
#helperblogger-searchbox {
border-radius: 5px;
background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjt5KWSon6s2_qNyqoMTR88rq55FBIdFyfjD4JQzH36RDXwJ6JYnUhVhiac1robd0-OfnFpPkNt0TN3wAbMAZ-fEJY3wrcwHlXd-_p-H56PJLps5dfmUGL00UUrZP-PoWXZfjR097FAio4/s1600/helperblogger.com-orange.png) no-repeat scroll center center transparent;
width: 307px;
height: 50px;
disaply: block;
}
form#helperblogger-searchform {
display: block;
padding: 10px 12px;
margin: 0;
}
form#helperblogger-searchform #s {
padding-left: 24px !important;
padding: 7.5px;
margin: 0;
width: 220px;
font-size: 14px;
font-family: verdana;
vertical-align: top;
border: none;
background: transparent;
}
form#helperblogger-searchform
#sbutton {
margin: 0;
padding: 0;
height: 40px;
width: 44px;
vertical-align: top;
border: none;
background: transparent;
}
</style>
<div id="helperblogger-searchbox">
<form id="helperblogger-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 type="text/css">
#helperblogger-searchbox {
border-radius: 5px;
background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmR_D8V5LwpLun7SybHjfRAoRPfwaseF8Si6UXMRXGSz66L3bDqNXI3WMeCNDZi7IybJyby2mVMPc5TKdwdfjLrfHrOTeOkMmeG9NVdkBr2NWoTIQ4dKMRM8Vd7aykarne6vhYgqYkZcM/h57/helperblogger.com-pink.png) no-repeat scroll center center transparent;
width: 307px;
height: 50px;
disaply: block;
}
form#helperblogger-searchform {
display: block;
padding: 10px 12px;
margin: 0;
}
form#helperblogger-searchform #s {
padding-left: 24px !important;
padding: 7.5px;
margin: 0;
width: 220px;
font-size: 14px;
font-family: verdana;
vertical-align: top;
border: none;
background: transparent;
}
form#helperblogger-searchform
#sbutton {
margin: 0;
padding: 0;
height: 40px;
width: 44px;
vertical-align: top;
border: none;
background: transparent;
}
</style>
<div id="helperblogger-searchbox">
<form id="helperblogger-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>
Hi. I’m Designer of Blog Magic. I’m CEO/Founder of ThemeXpose. I’m Creative Art Director, Web Designer, UI/UX Designer, Interaction Designer, Industrial Designer, Web Developer, Business Enthusiast, StartUp Enthusiast, Speaker, Writer and Photographer. Inspired to make things looks better.
0 yorum:
Yorum Gönder