Kotak Penelusuran Blogger dengan AJAX jQuery
Beberapa waktu yang lalu Saya pernah menuliskan cara menampilkan hasil penelusuran dengan JSON Blogger tanpa harus berpindah dari halaman awal menuju halaman hasil penelusuran dengan JavaScript (Anda bisa membacanya di sini).
Melalui jQuery $.ajax() kita bisa meniadakan penyisipan script callback dan langsung memanggil JSON dengan cara seperti ini:
$('#search-form').on("submit", function() {
$.ajax({
url: '/feeds/posts/summary?alt=json-in-script&q=KATA_KUNCI',
type: 'get',
dataType: 'jsonp',
success: function(json) {
…
}
});
});Sehingga jika dijabarkan akan menjadi seperti ini:
HTML Formulir
<form action="/search" id="ajax-search-form">
<input type="text" name="q">
<input type="submit" value="Search">
</form>jQuery
(function($) {
var $form = $('#ajax-search-form'),
$input = $form.find(':text');
$form.append('<div id="search-result"></div>');
var $result_container = $('#search-result');
$form.on("submit", function() {
var keyword = $input.val();
$result_container.show().html('Loading...');
$.ajax({
url: 'http://nama_blog.blogspot.com/feeds/posts/summary?alt=json-in-script&q=' + keyword + '&max-results=9999',
type: 'get',
dataType: 'jsonp',
success: function(json) {
var entry = json.feed.entry,
link, skeleton = "";
if (typeof entry !== "undefined") {
skeleton = '<h4>Search results for keyword "' + keyword + '"</h4>';
skeleton += '<a class="close" href="/">×</a><ol>';
for (var i = 0; i < entry.length; i++) {
for (var j = 0; j < entry[i].link.length; j++) {
if (entry[i].link[j].rel == "alternate") {
link = entry[i].link[j].href;
}
}
skeleton += '<li><a href="' + link + '">' + entry[i].title.$t + '</a></li>';
}
skeleton += '</ol>';
$result_container.html(skeleton);
} else {
$result_container.html('<a class="close" href="/">×</a><strong>No result!</strong>');
}
},
error: function() {
$result_container.html('<a class="close" href="/">×</a><strong>Error loading feed.</strong>');
}
});
return false;
});
$form.on("click", ".close", function() {
$result_container.fadeOut();
return false;
});
})(jQuery);Cara Kerja
Pertama-tama kita tangkap beberapa elemen penting yaitu formulir pencarian dan elemen input kata kunci pencarian:
var $form = $('#ajax-search-form'), // Mendapatkan elemen formulir
$input = $form.find(':text'); // Mendapatkan elemen input bertipe teks (penampung kata kunci pencarian)Sisipkan sebuah elemen HTML secara tidak langsung sebagai kontainer hasil pencaran:
$form.append('<div id="search-result"></div>');
var $result_container = $('#search-result');Setelah itu kita berlakukan event .submit() atau .on("submit") pada formulir untuk kemudian kita bisa langsung memproses data JSON yang akan ditransfer pada saat yang bersamaan ketika kita menekan tombol Enter pada papan ketik atau mengeklik tombol penelusuran di dalam formulir:
$form.on("submit", function() {
$.ajax(url, type, dataType, success, error); // Dapatkan data dan proses data di sini...
return false; // <= Ini digunakan untuk mencegah formulir membawa kita menuju halaman hasil penelusuran saat kita men-submit kata kunci pencarian
});Pengambilan data JSON dilakukan oleh jQuery $.ajax(), sehingga kita tidak perlu menyisipkan skrip callback ke dalam area <head> seperti dalam metode JavaScript mentah pada umumnya:
$.ajax({
url: 'http://nama_blog.blogspot.com/feeds/posts/summary?alt=json-in-script&q=' + keyword + '&max-results=9999',
type: 'get',
dataType: 'jsonp',
success: function(json) {
var entry = json.feed.entry,
link, skeleton = "";
if (typeof entry !== "undefined") {
skeleton = '<h4>Search results for keyword "' + keyword + '"</h4>';
skeleton += '<a class="close" href="/">×</a><ol>';
for (var i = 0; i < entry.length; i++) {
for (var j = 0; j < entry[i].link.length; j++) {
if (entry[i].link[j].rel == "alternate") {
link = entry[i].link[j].href;
}
}
skeleton += '<li><a href="' + link + '">' + entry[i].title.$t + '</a></li>';
}
skeleton += '</ol>';
$result_container.html(skeleton);
} else {
$result_container.html('<a class="close" href="/">×</a><strong>No result!</strong>');
}
},
error: function() {
$result_container.html('<a class="close" href="/">×</a><strong>Error loading feed.</strong>');
}
});keyword adalah variabel. Nilainya diambil dari elemen input teks:
var keyword = $input.val();
// `/feeds/posts/summary?alt=json-in-script&q=keyword&max-results=9999`Integrasi Widget ke Blogger
Widget ini hanya akan bekerja jika blog Anda sudah dilengkapi dengan jQuery.
Pertama-tama masuk ke halaman Tata Letak, kemudian tambahkan sebuah elemen halaman HTML/JavaScript. Salin kode ini dan letakkan di dalam formulirnya:
<style scoped="scoped">
#ajax-search-form {
position:relative;
font:normal normal 13px/normal Helmet,FreeSans,Sans-Serif;
}
#ajax-search-form a {
color:#741F27;
text-decoration:none;
}
#ajax-search-form input {
border:1px solid #ccc;
border-top-color:#999;
background-color:white;
font:inherit;
color:black;
margin:0 0;
padding:5px 5px;
width:180px;
}
#ajax-search-form input::-moz-focus-inner {
margin:0;
padding:0;
border:none;
outline:none;
}
#ajax-search-form input[type="submit"] {
width:auto;
background-color:#084670;
border-color:transparent;
color:#B4D8F0;
font-weight:bold;
cursor:pointer;
padding-left:7px;
padding-right:7px;
}
#ajax-search-form input[type="submit"]:hover,
#ajax-search-form input[type="submit"]:focus {background-color:#083E5F}
#search-result {
border:1px solid #bbb;
background-color:white;
padding:10px 15px;
margin:2px 0;
width:auto;
height:auto;
position:absolute;
top:100%;
left:0;
z-index:99;
-webkit-box-shadow:0 1px 3px rgba(0,0,0,.4);
-moz-box-shadow:0 1px 3px rgba(0,0,0,.4);
box-shadow:0 1px 3px rgba(0,0,0,.4);
display:none;
}
#search-result ol,
#search-result li,
#search-result h4 {
margin:0;
padding:0;
}
#search-result h4,
#search-result strong {
display:block;
margin:0 30px 10px 0;
}
#search-result ol {margin:0 0 10px 28px}
#search-result ol a:hover {text-decoration:underline}
#search-result .close {
display:block;
position:absolute;
top:6px;
right:10px;
line-height:normal;
color:#17950F;
}
#search-result strong {color:#B75252}
</style>
<form action="/search" id="ajax-search-form">
<input type="text" name="q"/>
<input type="submit" value="Search"/>
</form>
<script>
(function($) {
var $form = $('#ajax-search-form'),
$input = $form.find(':text');
// Append a search result container to the search form
$form.append('<div id="search-result"></div>');
var $result_container = $('#search-result');
// When the keyword is submitted…
$form.on("submit", function() {
// Get the input value
var keyword = $input.val();
// Show the search result container and insert a `Loading...` text
$result_container.show().html('Loading...');
// Get the blog JSON via $.ajax() to show the search result
// The URL format: http://blog_name.blogspot.com/feeds/posts/summary?alt=json-in-script&q={THE_KEYWORD}&max-results=9999
$.ajax({
url: 'http://nama_blog.blogspot.com/feeds/posts/summary?alt=json-in-script&q=' + keyword + '&max-results=9999',
type: 'get',
dataType: 'jsonp',
// If success, grab the search result list…
success: function(json) {
var entry = json.feed.entry,
link, skeleton = "";
if (typeof entry !== "undefined") {
skeleton = '<h4>Search results for keyword "' + keyword + '"</h4>';
skeleton += '<a class="close" href="/">×</a><ol>';
for (var i = 0; i < entry.length; i++) {
for (var j = 0; j < entry[i].link.length; j++) {
if (entry[i].link[j].rel == "alternate") {
link = entry[i].link[j].href;
}
}
skeleton += '<li><a href="' + link + '">' + entry[i].title.$t + '</a></li>';
}
skeleton += '</ol>';
$result_container.html(skeleton);
} else {
// If the JSON is empty … (entry === undefined)
// Show the `not found` or `no result` message
$result_container.html('<a class="close" href="/">×</a><strong>No result!</strong>');
}
},
error: function() {
// If error, show an error message
$result_container.html('<a class="close" href="/">×</a><strong>Error loading feed.</strong>');
}
});
return false;
});
// Fade out the search result container if the close button is clicked
$form.on("click", ".close", function() {
$result_container.fadeOut();
return false;
});
})(jQuery);
</script>Ganti kode yang Saya beri tanda dengan URL blog Anda kemudian klik Simpan Widget.
66 Comments:
simple n cool :-bd
keren dan waaaaaaaaaaaaaw x@
wah, ini ringan mas, tapi apakah kita bisa mengedit hasil dari Searchnya ?
misal kita mau memberi warna pada Kata kunci seperti fungsi Find pada browser gitu :D
Pakai RegExp(), lalu ubah karakter judulnya:
var mark = new RegExp(keyword, "ig");
skeleton += '<li><a href="' + link + '">' + entry[i].title.$t.replace(mark, "<span style=\'background-color:pink;text-decoration:underline;\'>" + keyword + "</span>") + '</a></li>';
Demo: http://jsfiddle.net/tovic/N8H7W/
kalo urusan search mencari sudah enak dah pakek jQuery AJAX API, KOMPLIT.
undercover-blogger.blogspot.com/2012/10/google-web-search-api.html
tinggal add di add gadget blogger :D
di judul aja nih, enggak sekalian di adain headline artikelnya!
good good good :-bd
sip deh mas, apakah Search tools ini sama seperti punyanya mas tofik ?
kalo iya, kok ada sebuah fungsi di URLnya mas ?
contoh saya mau Search "jquery"
di akhir URL ada tambahan ...?q=jquery sebenernya saya pengin yang kaya gitu, tapi saya coba yang ini dulu deh :-bd
mas Taufik,
saya menggunakan search bawaan dari widget google.
ketika saya search mengapa 'isinya' poisisinya bisa di atas banget ya?
butuh pencerahan mas..
#CustomSearch1 .widget-content {margin-top:15px}
#CustomSearch1_form {position:relative}
masih ga effect mas.. bisa di cek lagi http://sdftyujklvbn.blogspot.com
gimana cara menerapkannya pada navigasi?
Mantap sob, thank infonya telah berbagi share
permisi,ijin pakai bbrp kode nya. mksh
kode untuk tombol close yang mana mas mohon pencerahannya
kalau pengen ganti icon searchnya gimana mas?
tolong pencerahanya icon search yg warna biru di atas kurang keren
Ganti <input type="submit" value="Search" /> menjadi:
<input type="image" src="URL-gambar.jpg" />
Kalau di terapkan di Menu Navigasi Gimana ?
wah, keren tutorialnya mas, izin coba ya :)
Di blog saya kok hasil penelusurannya pindah ke halaman lain ? Tolong di Cek http://aldhinya.blogspot.com/. thanks..
apakah alamat blognya sudah di ubah?
Sudah..
apakah blog anda sudah terpasang jquery?
Sudah.. saya sudah mengikuti semua cara di atas, anehnya di blog saya hasil penelusurannya masih tetep pindah ke halaman baru..
Kode JavaScript ini tidak berada di dalam event DOM Ready, jadi harus diletakkan setelah formulir penelusuran, misalnya di atas </body>
Atau bisa juga dengan cara mengubah bagian ini:
(function($) {
...
})(jQuery);
menjadi seperti ini, jika ingin tetap meletakkan kode JavaScript di dalam <head></head>:
(function($) {
$(document).ready(function() {
...
});
})(jQuery);
Terima Kasih atas bantuannya, sekarang sudah Bisa... \o/ :-bd :D
Bisa nggak kalau ngasih Scroll pada hasil penelusurannya, karena jika kita mengetik sebuah kata kunci, dan hasilnya begitu banyak, yang tampil pun tidak semuanya, pinginnya ngasih Scroll agar hasil penelusurannya bisa tampak semua...
#search-result {
max-height:200px;
overflow:auto;
}
Maaf Mas, Mau nanya lagi. Bisa gak kalau link di hasil penelusurannya pada saat di klik pindah ke TAB baru..? ;)
skeleton += '<li><a target="_blank" href="' + link + '">' + entry[i].title.$t + '</a></li>';
Sudah berhasil Mas, thenk yu ya... \o/
Kalau Modifikasi Search Resultnya jadi kayak begini gimana ya ?
http://2.bp.blogspot.com/-zgQFpLW6Qxk/UiLXaaawlAI/AAAAAAAABRE/2xjLh_Ll7GE/s797/ngawur.jpg
hi, kalau saya hendak menggunakan feed selain daripada blogger boleh ke?
sample -
url: 'http://www.rssmix.com/u/3828765/rss.xml?alt=json-in-script&q=' + keyword + '&max-results=9999',
bisa gak? saya sudah cuba di jsfiddle, tapi ada masalah. ada solusinya gak?
Kalaupun bisa, mungkin format data, dukungan dan logika parameter URL serta penamaan key di dalam JSON mereka akan berbeda. Harus dibuat fungsi yang baru lagi. Untuk mengetahui apakah JSON bisa dijadikan widget atau tidak bisa dicoba dengan cara mengakses URL tersebut pada adress bar atau membaca dokumentasi tentang layanan tersebut.
Saya tidak tahu soal layanan ini, tapi untuk mengakses file dengan format JSON, gunakan ekstensi .json yang (ternyata) tersedia ⇒ http://www.rssmix.com/u/3828765/rss.json
Coba bandingkan dengan ini ⇒ http://dte-feed.blogspot.com/feeds/posts/default?alt=json
Mas, saya sudah coba tahap demi tahap tapi hasilnya ketika melakukan pencarian itu Error loading page.. Apa artinya itu kata kunci tidak ditemukan ato ada kelalaian dari saya.?
maksudnya Error loading feed
sudah berhasil mas tapi saya kesulitan untuk menambahkan summary dan thumbnailnya... akan saya coba terus tpi kalau gagal mhon bantuannya mas..
<style scoped="scoped">
#ajax-search-form {
position:relative;
font:normal normal 13px/normal Arial,Sans-Serif;
}
#ajax-search-form a {
color:#741F27;
text-decoration:none;
}
#ajax-search-form input {
border:1px solid #ccc;
border-top-color:#999;
background-color:white;
font:inherit;
color:black;
margin:0 0;
padding:5px 5px;
width:180px;
}
#ajax-search-form input::-moz-focus-inner {
margin:0;
padding:0;
border:none;
outline:none;
}
#ajax-search-form input[type="submit"] {
width:auto;
background-color:#084670;
border-color:transparent;
color:#B4D8F0;
font-weight:bold;
cursor:pointer;
padding-left:7px;
padding-right:7px;
}
#ajax-search-form input[type="submit"]:hover,
#ajax-search-form input[type="submit"]:focus {background-color:#083E5F}
#search-result {
border:1px solid #bbb;
background-color:white;
padding:10px 15px;
margin:2px 0;
width:auto;
height:auto;
max-width:400px;
position:absolute;
top:100%;
left:0;
z-index:99;
-webkit-box-shadow:0 1px 3px rgba(0,0,0,.4);
-moz-box-shadow:0 1px 3px rgba(0,0,0,.4);
box-shadow:0 1px 3px rgba(0,0,0,.4);
display:none;
}
#search-result ol,
#search-result li,
#search-result h4 {
margin:0;
padding:0;
}
#search-result h4,
#search-result strong {
display:block;
margin:0 30px 10px 0;
}
#search-result ol {margin:0 0 10px 0}
#search-result ol a {font-weight:bold}
#search-result ol a:hover {text-decoration:underline}
#search-result li {
overflow:hidden;
list-style:none;
margin-top:10px;
}
#search-result .close {
display:block;
position:absolute;
top:6px;
right:10px;
line-height:normal;
color:#17950F;
}
#search-result strong {color:#B75252}
#search-result img {
float:left;
margin:2px 10px 5px 0;
padding:2px;
border:1px solid #ccc;
}
</style>
<form action="/search" id="ajax-search-form">
<input type="text" name="q" />
<input type="submit" value="Search" />
</form>
<script>
(function($) {
var $form = $('#ajax-search-form'),
$input = $form.find(':text');
// Append a search result container to the search form
$form.append('<div id="search-result"></div>');
var $result_container = $('#search-result');
// When the keyword is submitted...
$form.on("submit", function() {
// Get the input value
var keyword = $input.val();
// Show the search result container and insert a `Loading...` text
$result_container.show().html('Loading...');
// Get the blog JSON via $.ajax() to show the search result
// The URL format: http://blog_name.blogspot.com/feeds/posts/summary?alt=json-in-script&q={THE_KEYWORD}&max-results=9999
$.ajax({
url: 'http://latitudu.blogspot.com/feeds/posts/summary?alt=json-in-script&q=' + keyword + '&max-results=9999',
type: 'get',
dataType: 'jsonp',
// If success, grab the search result list...
success: function(json) {
var entry = json.feed.entry,
link, summary, thumbnail, skeleton = "";
if (entry !== undefined) {
skeleton = '<h4>Search results for keyword “' + keyword + '”</h4>';
skeleton += '<a class="close" href="/">×</a><ol>';
for (var i = 0; i < entry.length; i++) {
for (var j = 0; j < entry[i].link.length; j++) {
if (entry[i].link[j].rel == "alternate") {
link = entry[i].link[j].href;
}
}
thumbnail = ("media$thumbnail" in entry[i]) ? '<img alt="" src="' + entry[i].media$thumbnail.url.replace(/\/s[0-9]+\-c/, "/s40-c") + '" width="40" height="40">' : "";
summary = ("summary" in entry[i]) ? entry[i].summary.$t.replace(/<br ?\/?>/ig, " ").replace(/<.*?>/g, "").replace(/[<>]/g, "") : "";
summary = summary.length > 100 ? summary.substring(0, 100) + '…' : summary;
skeleton += '<li>' + thumbnail + '<a href="' + link + '">' + entry[i].title.$t + '</a><br>' + summary + '</li>';
}
skeleton += '</ol>';
$result_container.html(skeleton);
} else {
// If the JSON is empty ... (entry === undefined)
// Show the `not found` or `no result` message
$result_container.html('<a class="close" href="/">×</a><strong>No result!</strong>');
}
},
error: function() {
// If error, show an error message
$result_container.html('<a class="close" href="/">×</a><strong>Error loading feed.</strong>');
}
});
return false;
});
// Fade out the search result container if the close button is clicked
$form.on("click", ".close", function() {
$result_container.fadeOut();
return false;
});
})(jQuery);
</script>
Apakah untuk menempatkan hasil penelusuran di elemen tertentu diperlukan pemanggilan dengan menambahkan getElementById
Coba ganti nilai variabel $result_container menjadi seperti ini dan lihat sendiri hasilnya:
var $result_container = $('#Blog1');
makasih mas... ternyata simple ya.. kalo kita tahu dan faham JS.. kalo boleh tahu refferensi belajar JS didapat dari mana mas... seperti buku apa ato gmn?
Baguslah kalau sudah paham sama logikanya. Sering-sering praktek saja.
Lebih sulit dari try out matematika dan ipa nih mas ~x(
Cara membuat Search Result di statik page gimana boss
⇒ https://www.google.com/search?q=memasang+google+cse+di+blogspot
makasih kang , saya sudah berhasil \o/
Trimssss...!!!
Mas kalau untuk membatasi jumlah pencarian'y gimana ??? misalkan hasil yg ditampilkan hanya 5
Maaf mas taufik ternyata sudah bisa hehe
keburu nyerah tadinya ... makasih mas
Sama dengan cara yang ini → /2012/03/membatasi-jumlah-posting-pada-halaman.html
sukses hehe .. hatur nuhun mas
http://reactorontohod.blogspot.com/
:-bd makasih kang
Kang, saya udah nyoba ngebagi hasil pencarian ke dalam beberapa halaman, tapi saya gagal terus dalam ngebuat fungsi next() sama prev()-nya. Udah ngulik soal start-index sama max-result, tapi gagal terus. Kira-kira script buat fungsi next() sama prev()-nya gimana, ya?
Mohon bantuannya, Kang 0:)
Saya tambahkan fungsi next/prev di sini → http://jsbin.com/sutevi/edit?html,output
Keren gan, tapi ga jalan kalo pasang langsung di template
pak, kalau di form search-nya dikasih option mencari di blog atau mencari di google cse, nambahi sekripnya bagaimana? *kliyeng2 :p
Saya kasi tahu dasarnya saja ya:
<form action="/search" method="get" onsubmit="window.open(this.r.value + '?q=' + encodeURIComponent(this.q.value));return false;" target="_blank">
<p>
<input name="q" type="text"/>
<button type="submit">Cari</button>
</p>
<p>
<label>
<input name="r" type="radio" value="/search" checked="checked"/> cari di blog
</label>
<label><input name="r" type="radio" value="https://www.google.com/search"/> cari di google</label>
</p>
</form>
Demo: http://output.jsbin.com/zagafilowi
kalo dibikin seperti ini, pasti selalu keluar layout..
#ajax-search-form input { width:100%}
Nggak akan keluar kalau nggak ada tombolnya. Lalu juga:
#ajax-search-form input {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
width:100%;
}
Metode ini mungkin bisa menjadi solusi → http://cssdeck.com/labs/fluid-width-search-box
Hii, i love this script, tell me something, its possible to add more then one source for research, like two blogger feeds?
Add this snippet just before the $.ajax({ line:
$.ajax({
url: 'http://nama_blog_2.blogspot.com/feeds/posts/summary?alt=json-in-script&q=' + keyword + '&max-results=9999',
type: 'get',
dataType: 'jsonp',
// If success, grab the search result list…
success: function(json) {
var entry = json.feed.entry,
link, skeleton = "";
if (typeof entry !== "undefined") {
for (var i = 0; i < entry.length; i++) {
for (var j = 0; j < entry[i].link.length; j++) {
if (entry[i].link[j].rel == "alternate") {
link = entry[i].link[j].href;
}
}
skeleton += '<li><a href="' + link + '">' + entry[i].title.$t + '</a></li>';
}
$result_container.append(skeleton);
}
}
});
thank you for the reply! it's amazing!
If i may, i'm using the version with thumbnails that you kindly released a few comments up and i'm using this to show thumbnails:
$.ajax({
url: 'https://www.blogname.com/feeds/posts/summary?alt=json-in-script&q=' + keyword + '&max-results=9999',
type: 'get',
dataType: 'jsonp',
// If success, grab the search result list…
success: function(json) {
var entry = json.feed.entry,
link, summary, thumbnail, skeleton = "";
if (entry !== undefined) {
for (var i = 0; i < entry.length; i++) {
for (var j = 0; j < entry[i].link.length; j++) {
if (entry[i].link[j].rel == "alternate") {
link = entry[i].link[j].href;
}
}
thumbnail = ("media$thumbnail" in entry[i]) ? '<img alt="" src="' + entry[i].media$thumbnail.url.replace(//s[0-9]+-c/, "/s500") + '" width="100%" height="auto"!important>' : "";
summary = ("summary" in entry[i]) ? entry[i].summary.$t.replace(/<br ?/?>/ig, " ").replace(/<.*?>/g, "").replace(/[<>]/g, "") : "";
summary = summary.length > 0 ? summary.substring(0, 0) + '…' : summary;
skeleton += '<li>' + thumbnail + '<a href="' + link + '">' + entry[i].title.$t + '</a><br>' + summary + '</li>';
}
skeleton += '</ol>';
$result_container.append(skeleton);
}
}
});
it's working fine, but even with the returning the results properly the "No Result" message still showing
$.ajax({
url: 'https://www.blogname.com/feeds/posts/summary?alt=json-in-script&q=' + keyword + '&max-results=9999',
type: 'get',
dataType: 'jsonp',
// If success, grab the search result list…
success: function(json) {
var entry = json.feed.entry,
link, summary, thumbnail, skeleton = "";
if (entry !== undefined) {
for (var i = 0; i < entry.length; i++) {
for (var j = 0; j < entry[i].link.length; j++) {
if (entry[i].link[j].rel == "alternate") {
link = entry[i].link[j].href;
}
}
thumbnail = ("media$thumbnail" in entry[i]) ? '<img alt="" src="' + entry[i].media$thumbnail.url.replace(//s[0-9]+-c/, "/s500") + '" width="100%" height="auto"!important>' : "";
summary = ("summary" in entry[i]) ? entry[i].summary.$t.replace(/<br ?/?>/ig, " ").replace(/<.*?>/g, "").replace(/[<>]/g, "") : "";
summary = summary.length > 0 ? summary.substring(0, 0) + '…' : summary;
skeleton += '<li>' + thumbnail + '<a href="' + link + '">' + entry[i].title.$t + '</a><br>' + summary + '</li>';
}
skeleton += '</ol>';
$result_container.append(skeleton);
}
}
});
and i forgot, i wish open the links in the result in another page, like blank stuff, if you help with this thing i'll be appreciated, sorry for bothering
I’ll take my time to create another AJAX search widget with simpler installation.
thanks for you hard work!
Take a look here 😉
Post a Comment
<< Home