VIEW SNIPPET

Membuat Related Post di Sidebar

Halo temen-temen blogger,sebelumnya saya sudah pernah membahas tentang membuat related post dengan thumbnail
postingan kali ini menjawab pertanyaan dari riya

Oke langsung saja begini caranya...
1. Log In >> Rancangan >> Edit HTML
2. Cari kode </head>
3. Letakkan kode berikut ini tepat diatas </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>


4. SAVE
5. Rancangan >> Edit HTML >> Klik Expand Template Widget
6. Cari kode seperti ini
<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:loop>
</b:if>


7. Masukkan kode berwarna biru seperti ini :
<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&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
</b:if>

</b:loop>
</b:if>


8. SAVE
9. Masuk Rancangan >> Elemen Laman >> Add Gadget (ditempat mana yang diinginkan) >> pilih HTML/Javascript
10. Masukkan kode berikut ini

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


Beri judul Related Post atau sesuai yang diinginkan
11. Simpan
12. Masuk lagi Rancangan >> Edit HTML >> Expand template widget
13. Cari kode di bawah ini. Fokus pada tulisan Related Post atau sesuai yang dilakukan pada langkah 10

<b:widget id='HTML13' locked='false' title='related post' type='HTML'>
<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>


Tulisan biru adalah yang harus ditambahkan.
14. Tinggal di SAVE deh...



Sekian postingan kali ini semoga membantu...
Terima kasih

5 Responses so far.

  1. bermanfaat sekalii
    sudah saya terapkan di web aku

  2. thanks sob, mantap deh

  3. wah, trima kasih banget atas tutorialnya sob... mantap nih...langsung di coba ah...

  4. gank-zone says:

    makasih infonya sob

  5. Dafone says:

    Hemmm... Makasih udah bisa nih... hehehe. BTW langkah terakhir untuk apa ya?