BH Blogger Arama Kutusu
Daha önce Blog Hocam’da kullandığım, HTML ve CSS kodları kullanarak oluşturduğum basit bir arama kutusu vardı. Onu kaldırıp yerine Google’ın kendi arama kutusunu koydum fakat eski arama kutusunun kodlarını isteyen çok arkadaş olduğu için buradan paylaşma ihtiyacı hissettim.
Resimde gördüğünüz bu CSS arama kutusunu eklemek için Blogger kumanda panelinize giriş yaptıktan sonra Yerleşim > Gadget Ekle > HTML/JavaScript Gadget yolunu izledikten sonra aşağıdaki kodları yapıştırıp kaydetmeniz yeterli olacaktır.
Bu arama kutusu HTML ile oluşturulduğundan “Google Custom Serach” deki gibi akıllı değildir ve detaylı arama yapmaz. Aradığınız terim ile blogdaki terimin %100 eşleşmesi gerekir. Eğer görselliğe önem veriyorsanız ve çok fazla içeriğiniz yoksa bu arama kutusunu kullanabilirsiniz fakat işlevselliğe önem veriyorsanız ve blogunuzda çok fazla içerik varsa şuan Blog Hocam’da da olan “Google Custom Search” ü kullanmanızı öneririm.
Resimde gördüğünüz bu CSS arama kutusunu eklemek için Blogger kumanda panelinize giriş yaptıktan sonra Yerleşim > Gadget Ekle > HTML/JavaScript Gadget yolunu izledikten sonra aşağıdaki kodları yapıştırıp kaydetmeniz yeterli olacaktır.
<div id='arama'>
<form action='/search' id='searchThis' method='get'>
<input id='searchBox' name='q' onblur='if(this.value=='')this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value='';' size='20' type='text' value='Aranacak kelime'/>
<input id='searchButton' type='submit' value=''/>
</form>
</div>
<style>
#arama {
float:right;
width:258px;
padding-top:50px;
padding-bottom:30px;
padding-left:10px;
padding-right:-0px;
margin:0 0 20px 0;
background: url(https://lh3.googleusercontent.com/-Ahg_Mo-oIBs/UHxflUJpGFI/AAAAAAAAESQ/cTIHURTBtn8/s271/s.png) no-repeat 0px 0px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px
height:auto;
border:1px solid #656E75;
color:#000;
font-weight:bold;
}
#searchThis {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_ymYUlUzjqyf8OkiLhujiqZnHSln0twIb0Ow8VFA7ybYSw42zXea9PLZbY0vnVRCb0GoaU9EzZCKIeFtfyPCKfq1cis29R_-yeyOmTBSUflCH7IUVxvycPv1Tu736SQnHMzgNEmgcmtY/s1600/search.png") no-repeat scroll 0 0 transparent;
display: inline;
float: right;
margin:0 50px 0 0;
height: 24px;
width: 212px;
padding:2px 0 0 2px;
}
#searchBox, #searchButton {
background: none;
border:none;
}
#searchBox {
width:158px;
color:#bbb;
font-size: 12px;
}
#searchButton{
width:42px;
padding:0px;
cursor:pointer;
}
</style>
Bu arama kutusu HTML ile oluşturulduğundan “Google Custom Serach” deki gibi akıllı değildir ve detaylı arama yapmaz. Aradığınız terim ile blogdaki terimin %100 eşleşmesi gerekir. Eğer görselliğe önem veriyorsanız ve çok fazla içeriğiniz yoksa bu arama kutusunu kullanabilirsiniz fakat işlevselliğe önem veriyorsanız ve blogunuzda çok fazla içerik varsa şuan Blog Hocam’da da olan “Google Custom Search” ü kullanmanızı öneririm.
Bende özel arama kullanmıyorun çok sıradan kalıyor hocam sadece bir kaç renk verebiliyoruz o yüzden böyle özgün arama kutuları daha hoş duruyor :)
YanıtlaSilHarika bilgi ve yönlendirmeleriniz için çok teşekkürler.
YanıtlaSilHoş bir arama kutusu.
YanıtlaSil- Teşekkürler :)
Merhaba Hocam yeri değil ama 1 2 gündür uğraşıyorum bloğumdaki sorunu çözemedim ne güzel anasayfada yayın yapıyordum devamını kısalt özelliği ekledim çok güzel olmuştu durup dururken yayınlarım kayboldu sadece 1 tanesi görünüyor bir türlü düzeltemedim
YanıtlaSilhttp://y-gain.blogspot.com.tr/ bloğum bu yardımcı olacak arkadaş varsa sevinirim çaresis kaldım :(
Merhaba hocam
YanıtlaSilBlog hocamdada mevcut olan google custom search kutusunu öneririm demişsiniz fakat bunun kullanımına dair detaylı bir makaleniz var mı? Siteye direk kod konuluyor mu? Yoksa siteye özel kod mu alınıyor? Bunları bilmek isterim :)
Teşekkürler.
@pdf kitap indir
YanıtlaSilGadgetlar listesindeki arama kutusunu ekleyebilir ya da şu adresten oluşturacağınız arama kutusunun kodlarını HTML/Javascript gadget olarak ekleyebilirsiniz.
https://cse.google.com.tr
Hocam blogumla ilgili arama yapiyorum googlede.mesela a oyunu paylastim googlede a ariyorum b oyunu cikiyo neden acaba?
YanıtlaSilÇok güzel bir arama kutusu Paylaşım için teşekkürler.
YanıtlaSilYine güzel hoş bir tasarım zamanında merak etmiştim sizin bunu ancak böyle olduğunu öğrenince şimdilik istemedim ama yinede çok başarılı.İyi günler Serdar Kara
YanıtlaSilKendi blogumda bunu kullanmasamda çok hoş bir arama kutusu.Paylaşım için teşekkürler derdar hocam
YanıtlaSilGayet şık bir arama kutusu teşekkürler hocam. Sizin arama kutunuz her ne kadar güzelde olsa google kutusu kadar işlevsel olmuyor. O yüzden Google Custom Search hakkında sizden detaylı bir makale bekliyorum hocam nasıl kullanırız, nasıl ekleriz gibi. :)
YanıtlaSilİyi ki varsınız. Yoksa benim gibi çaylaklar onca değerli bilgiyi nasıl birarada bulacaktık....
YanıtlaSil