Sizinle paylaşacağım arama kutusunu diğerlerinden ayıran pek çok özellik var. Forumlardan aşikar olduğunuz bir arama kutusu kutusudur.İçerikleri ister web tarzı ister görsel isterseniz video ve haber tarzında arayınız.
Arama kutusunu kullanmak için yapmanız gereken tek şey Blogger kumanda paneline girdikten sonra Sayfalar> Yeni Sayfa > HTML/JavaScript yolunu izlemek ve aşağıdaki kodları eklemek.
DEMO
<script></script>
<script>
$(document).ready(function () {
function n(t) {
t = $.extend({}, e, t);
t.term = t.term || $("#s").val();
if (t.searchSite) {
t.term = "site:" + t.siteURL + " " + t.term
}
var i = "http://ajax.googleapis.com/ajax/services/search/" + t.type + "?v=1.0&callback=?";
var s = $("#resultsDiv");
$.getJSON(i, {
q: t.term,
rsz: t.perPage,
start: t.page * t.perPage
}, function (e) {
var i = e.responseData.results;
$("#Devamı").remove();
if (i.length) {
var o = $("", {
className: "pageContainer"
});
for (var u = 0; u < i.length; u++) {
o.append(new r(i[u]) + "")
}
if (!t.append) {
s.empty()
}
o.append('').hide().appendTo(s).fadeIn("slow");
var a = e.responseData.cursor;
if (+a.estimatedResultCount > (t.page + 1) * t.perPage) {
$("", {
id: "Devamı"
}).appendTo(s).click(function () {
n({
append: true,
page: t.page + 1
});
$(this).fadeOut()
})
}
} else {
s.empty();
$("", {
className: "notFound",
html: "Hiçbir sonuç bulunamadı!"
}).hide().appendTo(s).fadeIn()
}
})
}
function r(e) {
var t = [];
switch (e.GsearchResultClass) {
case "GwebSearch":
t = ['
"];
break;
case "GimageSearch":
t = ['', '', '', '', '', e.visibleUrl, "", ""];
break;
case "GvideoSearch":
t = ['', '', '', '', '', e.publisher, "", ""];
break;
case "GnewsSearch":
t = ['"];
break
}
this.toString = function () {
return t.join("")
}
}
var e = {
siteURL: "sosyaltus.com",
searchSite: true,
type: "web",
append: false,
perPage: 8,
page: 0
};
var t = $("", {
className: "arrow"
}).appendTo("ul.icons");
$("ul.icons li").click(function () {
var n = $(this);
if (n.hasClass("active")) {
return false
}
n.siblings().removeClass("active");
n.addClass("active");
t.stop().animate({
left: n.position().left,
marginLeft: n.width() / 2 - 4
});
e.type = n.attr("data-searchType");
$("#Devamı").fadeOut()
});
$("#siteNameLabel").append(" " + e.siteURL);
$("#searchSite").click();
$("li.web").click();
$("#s").focus();
$("#searchForm").submit(function () {
n();
return false
});
$("#searchSite,#searchWeb").change(function () {
e.searchSite = this.id == "searchSite"
})
})
</script>
Kaynak: Forum Tarzı Arama Kutusu