Kurulum oldukça basit. Bir kaç ufak ayarlamalar ile sizde sorunsuz bir şekilde bu autocomplete özelliğini kullanabilirsiniz...
Öncelikle sitemize 3 ana dosyayı tanımlıyoruz.
// aşağıdaki kod ve dosyayı head tagları arasına katalım.
<script></script>
//bu bölüme site adresini girip sonuna / bırakmayı unutmayın
<script>
var web_url = '';
</script>
Arama için kullandığımız form kodlarına gelelim. Örnek olarak aşağıdaki gibi olmalı.
Tek bir ayar kısmı kaldı. search.js dosyasının içinde arama yapmak için kullandığımız parametreleri ayarlayacağız.
(jQuery), $(window).load(function() {
$("#query").autocomplete({
source: function(e, t) {
var a = "//suggestqueries.google.com/complete/search?hl=en&ds=yt&client=youtube&hjson=t&cp=1&q=" + encodeURIComponent(e.term) + "&format=5&alt=json&callback=?";
$.getJSON(a, function(e) {
var a = [];
$.each(e[1], function(e, t) {
a.push(t[0])
}), t(a)
})
},
select: function(e, t) {
return location.href = web_url+"index.php?ara=" + t.item.label.replace(/\s+/g, '+')
},
delay: 200
})
});
Yukarıda görüldüğü üzere location.href kodu vardır. Bu kodda bulunan index.php benim arama için kullandığım dosyayı ifade eder. Sizde aramalarınızı hangi dosyada yaptırıyorsanız o dosyanın adını yazın. Örneğin search.php veya seo link var ise sadece search yazmanız yeterli olacaktır. index.php?ara bölümünde olan "ara" kodu sizin arama yaptırdığınız formun text name="" değeridir. Yukarıdaki örnek formda da gördüğünüz üzere benim text name="ara" değerim "ara" dır...
Kurulum bu kadar. Şimdi örnek olarak hazırladığım kodu indirebilir demoyu inceleyebilirsiniz. Bu sistem post metodu ile değil get metodu ile çalışmaktadır.
Demo: http://appstrdesign.com/google-arama
Gelişmiş Demo: http://videomp3indir.net/muzik-video-ara
Kaynak kodları indir: http://appstrdesign.com/google-arama/google.zip
Not: Demoda sadece en çok arama yapılan kelimeler gösterilir. Arama yapmaz. Detaylı gelişmiş örnekte arama yapabilir test edebilirsiniz. Ayrıca bu sistem tüm dilleri desteklemektedir.
Örnek Görünüm:
Ekstra Not:
İsterseniz kendi sisteminizi geliştirebilirsiniz. Aşağıda vereceğim json url ile en çok arananları listeleyebilir ve değişkene atabilirsiniz.
$kelime = "emrah karaduman";
//kelimeyi url encode içine atıp google'nin tanıdığı yapıya çeviriyoruz. Yoksa arama yapmaz.
$search_term = urlencode($kelime);
$json_url = "//suggestqueries.google.com/complete/search?hl=en&ds=yt&client=youtube&hjson=t&cp=1&q=$search_term&format=5&alt=json&callback=?";
Yukarıdaki kodu da json parse işlemleri ile dilediğiniz gibi kelimeleri sıralayabilirsiniz.