Cara Menampilkan Artikel Terkait di Sidebar
Cara Menampilkan Artikel Terkait di Sidebar sangatlah muda, hanya menambahkan beberapa kode saja pada Edit HTML dan tampilannya bisa anda liat di sidebar saya, sebelumnya saya posting tentang Cara Menghilangkan Garis Tepi (Border) pada Iklan KumpulBlogger, dan kali ini saya akan berbagi lagi tentang bagaimana Cara Menampilkan Artikel Terkait di Sidebar.
langsung aja ya, berikut ini langkah-langkah Menampilkan Artikel Terkait di Sidebar :
seperti biasa kita masuk ke Edit HTML dan jangn lupa untuk memberi tanda centang pada Expand Template Widget. Tapi sebelumnya saya sarankan agar mengback-up template anda terlebih dulu, sekedar jaga-jaga siapa tauk terjadi kesalahan.
Carai kode </head> dan letakkan kode berikut ini sebelum kode </head>:
simpan template anda, dan sekarang kita menuju ke Tata Letak>>Tambah Gadget di sidebar yang anda mau tempati untuk artikel terkait ini
kemudian pilih HTML/Javascript dan masukkan kode berikut ini :
Kita kembali ke Edit HTML tadi dan Cari kode yang seperti ini, dan sisipkan kode yang berwarna merah:
Kemudian Save lagi dan liat hasilnya
Semoga Bermanfaat...
langsung aja ya, berikut ini langkah-langkah Menampilkan Artikel Terkait di Sidebar :
seperti biasa kita masuk ke Edit HTML dan jangn lupa untuk memberi tanda centang pada Expand Template Widget. Tapi sebelumnya saya sarankan agar mengback-up template anda terlebih dulu, sekedar jaga-jaga siapa tauk terjadi kesalahan.
Carai kode </head> dan letakkan kode berikut ini sebelum kode </head>:
<script type="text/javascript">kemudian cari kode di bawah ini :
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;
}
}
}
}
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];
}
}
relatedTitles = tmp2;
relatedUrls = tmp;
}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;
}
function printRelatedLabels() {
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
}
document.write('</ul>');
}
//]]>
</script>
<b:if cond='data:post.labels'>lalu sisipkan kode berwarna merah, dan hasilnya akan seperti ini :
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
<b:if cond='data:blog.pageType == "item"'><script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=10"' type='text/javascript'/></b:if></b:loop>
</b:if>
simpan template anda, dan sekarang kita menuju ke Tata Letak>>Tambah Gadget di sidebar yang anda mau tempati untuk artikel terkait ini
kemudian pilih HTML/Javascript dan masukkan kode berikut ini :
<script type="text/javascript">Anda sudah selesai Menampilkan Artikel Terkait di Sidebar. Namun artikel terkait akan selalu muncul di halaman depan blog, untuk membuat artikel terkait hanya muncul pada halaman postingan saja, maka anda harus mengubah beberapa kode lagi:
removeRelatedDuplicates();
printRelatedLabels();
</script>
Kita kembali ke Edit HTML tadi dan Cari kode yang seperti ini, dan sisipkan kode yang berwarna merah:
<b:widget id='HTML2' locked='false' title='Artikel Terkait' type='HTML'>Untuk tulisan HTML 2 dan Artikel Terkait, hanya mengambil dari template saya, silahkan sesuaikan dengan template yang anda miliki, atau anda bisa mencari kode itu sesuai dengan judul widget anda,misalnya Artikel Terkait.
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'><!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if></b:includable>
</b:widget>
Kemudian Save lagi dan liat hasilnya
Semoga Bermanfaat...