Blogunuzdaki içerik sayınız arttıkça zamanla siz bile yazdığınız şeyi blogunuzda bulmak için baya bir vakit harcarsınız, birde blogunuza gelen ziyaretçileri düşünün, bu yüzden blogunuza gelen ziyaretçilerin aradığını rahatlıkla bulabilmesi için blogunuza mutlaka arama kutusu eklemelisiniz.Blogger kullanıcıları blogunuza özel entegrasyonu yapılmış ve temanızın rengine uygun arama kutusunu blogunuza basit bir yöntemle ekleyip ziyaretçilerinizin blogunuzda aradığını anında bulmalarına yardımcı olabilirsiniz.
Arama kutularını blogunuza eklemek için:
Kumanda Paneli>Tasarım>Gadget Ekle>Html/Javasript yolunu takip edip hangi arama kutusunu blogumuza eklemek istiyorsak aşşağıdaki kodlardan ona ait olan kodu kopyalıyoruz, açılan gadgetimizin içine yapıştırıp kaydediyoruz.
1.Arama Kutusu Stili:
<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL2qoP6OS9Baq9nf_keINdlxQLx8Nw07fwr-YowYEuE_tFmMaDVXELtSsqyZuMOzVBjNM6qMYZTo5wjcAV1j-Jul9h-yM5_9hYY9AkfDI58sa2s9c0oCgJ5I60gQ5xlNYJVvSEgTeeWJMo/) 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="Arama..." 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>
2.Arama Kutusu Stili:3.Arama Kutusu Stili:<style type="text/css"> #w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSzHf6vprhLt0_nkZi2aVhYgCILek5ji5ePHk94FLuDW0shh0F7P997qMWPLNfOJpup7Lyu2240LY9iI3eBwAYgRsSMj9DT4msCSjJ-DKR69gP9mINOMSZV3T7f50FjnlsLj0vPpyBjMZh/) 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="
Arama...
" 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>
4.Arama Kutusu Stili:<style type="text/css"> #w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8uX9CBoMjQr2REEedLntg64N1BuB-B-e5vrFkzoqDXi_2IhzZsvuPkwXW14m9rSUVHYC-6bviN5w18X0ItH9IpfLVFuU_cbA39vjAPsukp57E7AEbQ4qIVPUIu6zngEprhlNt5XjHd_zd/) 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="
Arama...
" 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">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPz3zNS6DVr94E6uFOATS4dYu2idAFfOEtI0r-ZfxClYCW3b_iqXhpp_NzC44u8WL3t2lDlGuJF0QjfKYF9a5JyPo0Vp2cICo4XDg-Sum4wDWbfKQAf7oOzKnKQ4aX5VMWDkkOMKjma5tJ/) 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>
5.Arama Kutusu Stili:
<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicB5FBkMM7wmVQgiTh5PB608_JqNYBQVBiwcukbQ2iJdwJYGHoodsWRkHCThiXYZxamwGvAhTfMzxHAE8cRPZdMjR8sYKCBjHCSVKHMHShwSBtknGgoaUOprmtmIMAHUC-FHL4Lpt7I-rl/) 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>
6.Arama Kutusu Stili:
<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvRd_UJrvKdVftM-NtXJZWjn1iotXnugwS0d0QB121dTo8MSMymoHdYiOvKmJ_RhzuecGYFtRToIE96LEsVRuh_ywokX-8q_Lv2EEiiWhRvE6npCLJx-8U0_GX9YEpJ0NG07J_ltlEkK5R/) 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>
Teşekkür ederim...Çok yakıştı siteme...:)
YanıtlaSilTesekkürlerimle:))
YanıtlaSilçok hoş bir sayfa bu:)
YanıtlaSilemeğinize sağlık..
çok yrarlı olacak eminimm herkese..
takipteyim.
bende sizi beklerim sayfama.
ve sayfamda gözünüze batan eksiklerim nelerdir,sizden link ekleyebileceğim?
başarılar dilerim..
Teşekkür ederim,bende blogunuzu ziyaret ettim çok güzel tarifler paylaşmışsınız.
YanıtlaSilHangi kullandığım blog eklentisinin altına yazacağıma resmen şaşırdım. Yalnız blogunuz şans eseri buldum ama iyi ki buldum. Diğer bloglara oranla sizin paylaştığınız eklentiler Gadget olarak eklendiğinden dolayı ayrıyetten çok kolaylık sağlamakta ve o kadar baktıgım site vardı ama buradaki kodların kalitesinde html kodları yoktu ayrıyetten bu yüzdende sizi kutlarım. Yeni getireceğiniz eklentileri sabırsızlıkla bekliyorum :)
YanıtlaSilÇok teşekkür ediyorum, yorumlarınızı okudukça Blog Okulunun kurulum hedefine emin adımlarla ilerlediği inancım pekişiyor.
YanıtlaSilbu eklentiyi seninde blog'unda konumlandırdıgın yere eklemek için hangi kodu bulmam gerekiyor?
YanıtlaSilbenim arama kutusu body-wrapper kısmının right(sağ) tarafında duruyor.
YanıtlaSilSaol Kardeşim Güzel Paylaşım
YanıtlaSilrica ederim,blogumu ziyaret etme nezaketi gösterdiğiniz için sizde sağolun.
YanıtlaSilarama kutusunun genişliğini hangi koddan değiştirebilirim? sayfanın tamamına yayılmasını istiyorum mesela.
YanıtlaSilkodlar içerisinde width=genişlik,height =yükseklik değerlerini değiştirerek isteğinize göre ayarlayabilirsiniz.
YanıtlaSilformu bozuluyo o zaman.şöyleki :
YanıtlaSilpaylaşım için teşekkürler,yaptım oldu,lakin bu tonu tam istediğim köşeye yerleştiremedim.mesela sayfanın sol üst köşesinde ana sayfa butonu var,sağ köşeye ara butonunu koyamıyorum,koyunca ana sayfa butonu nun yeri değişiyor,, sizinki gibi nasıl yaparım,böyle yan yana tek sıra dizilsin istiyorum,
YanıtlaSilana sayfa,sitene ekle,iletişim vs vs
bu dediğiniz şey tamamen sizin temanızla alakalı bir durum.Bahsettiğiniz kısmın genişliğini ayarlayıp arama butonunu yerleştireceğiniz yeri belirtmeniz gerekir.Örnek:
YanıtlaSilarama kutusu kodu
Hocam aramayı blog içinde değilde google da yapsın istiyorum yardmınız için şimdiden tşkler
YanıtlaSilArama kutusunun çalışması için bir internete bağlı olması mı gerekiyor? DW'a ekleyip F12 ile internette açıp ara dediğim zaman _blank yöntemi ile başka bir sekmede boş (hatalı) bir sayfada açıyor. Hiç bir sonuç göstermiyor. Bu kodlara başka ekleme mi yapmamıza gerek var mı?
YanıtlaSiladmin blogger da eski arayüzünü kullanırken google nin arama kutusunu ekleyince çalışıyordu ama yeni arayüzünde ekleyince hem kutu hatalı görünüyor hemde arama yapınca hata veriyor. sorun nasıl düzelir acaba?
YanıtlaSilşu anda denedim arama kutuları çalışıyor, bunu bir resimle size belgeliyeyim dedim.Resimde önce arama kutusunu ekledim,sonra arama yaptım ve ilgili yazılar çıktı.
YanıtlaSilElinize sağlık, bir sorum olacak; "kutuyu nasıl sağa yaslarım?
YanıtlaSilPeşinen teşekkürler