Cara Membuat Widget Artikel Terkait di Blogspot


Keberadaan widget artikel terkait atau related post amat berguna untuk meningkatkan page view blog. Jika Anda pengguna WordPress self hosting, banyak plugin artikel terkait yang dapat Anda gunakan secara gratis. Sementara itu, bagi Anda pengguna platform Blogger atau Blogspot Anda dapat memasangnya sendiri seperti petunjuk dibawah ini.

Masuk ke Dashboard Blogger

Pilih menu Template > Edit HTML

Pada jendela template editor, carilah kode </head>. Untuk mempercepat pencarian kode tersebut, silakan tekan Ctrl+F.

Jika kode </head> sudah Anda temukan, copy kode dibawah ini dan letakkan diatas kode </head>

Kode #1

<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>

Selanjutnya, cari kode <data:post.body/>. Apabila kode tersebut sudah ditemukan, silakan copy kode dibawah ini kemudian paste dibawah kode <data:post.body/>

Kode #2

<b:if cond=’data:post.labels’>
<b:loop values=’data:post.labels’ var=’label’>
<b:if cond=’data:blog.pageType == “item”‘>
<script expr:src='”/feeds/posts/default/-/” + data:label.name + “?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5″‘ type=’text/javascript’/>
</b:if>
</b:loop>
</b:if>
<b:if cond=’data:blog.pageType == “item”‘>
<h4>Artikel Terkait</h4>
<script type=”text/javascript”>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</b:if>

Simpan pengaturan template, dan silakan cek hasilnya.

cara membuat widget artikel terkait tanpa gambar
Screenshot widget artikel terkait

 

Catatan:

Bergantung pada template yang Anda gunakan, Anda akan menjumpai lebih dari satu kode <data:post.body/>. Pilihlah kode <data:post.body/> momor 2 dari bawah, dan jika widget artikel terkait belum muncul, maka silakan letakkan ulang kode #2 dibawah kode <data:post.body/> yang lain.

Hosting Terbaik Indonesia

1 Comment

Leave a Reply

Your email address will not be published. Required fields are marked *

*Hanya komentar relevan yg akan di publish; Gunakan nama Anda (no keywords), No spam!