Cara Bikin Artikel Terkait Sebelah kanan Sidebar

Sudah dari kemaren blog progress mau nulis tentang cara buat related post di sidebar kanan karena eman blog progress walaupun baru hampir 1o hari, awalnya saya lebih sibuk di blog proletar , dan beberapa hari kemaren saya lebih sibuk dengan info bengkulu, cz saya juga kasian liat kondisi my town tempat saya dilahirkan..

Eh kelamaan curhat nich..

Kembali ke pembahasan tentang buat related post.

Membuat sidebar biasanya ditempatkan dibawah posting/artikel, dengan berbagai modifikasi, ada yang menambahkan icon disamping judul artikel, ada yang membuat related post dengan fungsi scroll dan ada yang membuat related post tampil dengan image. banyak tentu tutorialnya, kali ini blog progress habis jalan-jalan malam dan terispirasi ingin berbagi mengenai cara membuat related post tampil di sidebar seperti di blog ini. caranya tidak sulit dan bahkan mudah untuk dilakukan, ingin tau caranya? mari kita simak tutorialnya."asrizalwahdanwilsa.blogspot.com"

• login ke account blogger anda, klik rancangan/layout lalu klik edit HTML
• Jangan lupa centang expand widget templates untuk mengedit template secara keseluruhan
• masukan kode dibawah ini sebelum tag

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

setelah itu cari kode widget seperti dibawah 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>

Kemudian tambahkan kode yang dicetak tebal pada kode tersebut:

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

• Save template
• kemudian buka Layout -> Page Elements dan add a new HTML/Javascript widget. beri judul atau title Title Related Post. kemudian copy paste script di bawah ini pada kotak yg disediakan "

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

Kalo sobat udah ngikutin tahapan-yahapan nya dengan benar pasti berhasil..
Simpan dan lihat hasil edit anda...
Coba bandingkan dengan sebelumnya. . !

Share |