• RSS Feed Wahyu Winoto
  • Twitter Wahyu Winoto
  • G+ Wahyu Winoto
  • Pinterest Wahyu Winoto
  • Facebook Wahyu Winoto
  • Instagram Wahyu Winoto
  • Whatsapp Wahyu Winoto



Memasang Artikel Terkait di Sidebar

Tutorial kali ini masih ada kaitannya dengan tutorial terdahulu tentang "Membuat dan Memasang Artikel Terkait di Blog", namun yang membedakan adalah kali ini saya tunjukkan cara memasang Related Posts atau Artikel Terkait di Sidebar/Widget Blog.

Caranya mudah saja, ikuti langkah-langkah berikut ini:

1. Login blogger
2. Tata Letak
3. Edit HTML
4. Centang Expand Template Widget
5. Letakkan kode berwarna biru berikut di atas </head>


<script type="text/javascript">
//<![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>





6. Kemudian cari kode berikut :



<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 != &quot;true&quot;'>,</b:if>
</b:loop>
</b:if>


Ganti dengan

<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 != &quot;true&quot;'>,</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10&quot;' type='text/javascript'/>
</b:if>
</b:loop>
</b:if>





Pada yang berwarna merah max-result menunjukkan maksimal artikel terkait yang akan ditampilkan per label. Jadi bisa ditampilkan hanya 7, atau bisa juga hingga 15 jika postingan Anda memiliki lebih dari satu label.

7. Simpan Template Anda.

8. Setelah selesai kamu simpan Template, kemudian beralih ke Elemen Laman, lalu masukkan kode berikut ini di gadget Anda (widget HTML/Javascript).

<script type="text/javascript">
removeRelatedDuplicates();
printRelatedLabels();
</script>





Simpan widget, lalu buka blog kamu.



Gimana, berhasil kan menambahkan artikel terkait atau related posts di sidebar Anda. 
Konon katanya widget ini akan membantu meningkatkan pengunjung serta meningkatkan page view blog Anda.


***
Baca juga: Related Post/Artikel Terkait model gambar bergerak/sliderBisnis Online Daftar Gratis Bonus jutaan rupiah



Silahkan share artikel

kepada saudara maupun sahabat yang membutuhkan.
Terima kasih.

KLIK UNTUK MELIHAT DAN ATAU MENUTUP KOLOM KOMENTAR.

wahyu-winoto.com www.wahyu-winoto.com gambar hiasan wahyu-winoto.com




Wahyu W - Bloger Indonesia


© 2010 - 2017 || Blog hosted by Blogger || Hak cipta dilindungi UU.
TOP