Cara Membuat Artikel Terkait Tampil di Sidebar Blog

Cara Membuat artikel terkait tampil di sidebar blog adalah lanjutannya saja dari postingan kemarin tentang Membuat artikel terkait atau related article[posts] dengan scroll kemarin. Sedang perbedaanya cuman letak artikel terkait itu saja, kalo yang kemarin letaknya di bawah postingan nah widget artikel terkait yang ini letaknya di samping, bisa kiri atau kanan, atau malah di atas postingan, tergantung sidebarnya ada dimana.

Sebagaimana yang tampil di blog cah cikrik ini yaitu pada widget yang tulisannya ‘Mungkin Ini Yang Anda Cari’

atau secara gambar yang di paintkan awut2an adalah seperti ini

Nah, Lalu dan kemudian terus cara membuat artikel terkait atau related article atau related artikel atau related posts atau artikel yang berhubungan atau postingan terkait atau artikel yang bersempena minjem bahasanya Bang attayaya agar supaya bisa tampil disidebar adalah sbb : [;-)]

Caranya hampir mirip dengan artikel terkait dibawah postingan, yaitu :

login ke blogger.com, klik tata letak [rancangan], klik edit html, lalu centang kotakkan kecil expand widgetsnya, lalu cari kode </head>

lalu letakkan kode berikut, diletakkan diatas kode head tadi

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

bila sudah cari kode lagi, kode yang 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 != &quot;true&quot;’>,</b:if>
</b:loop>
</b:if>

kalo udah ketemu, dihapus dan diganti dengan kode yang 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 != &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>

Bila sudah diganti, simpan Templet, lalu menuju kepenempatan gadget, mo ditempatkan dimanakah enaknya artikel terkait itu, jadi ya langsung kecara penempatannya. Ehm make gambar langsung saja dari pemilik script dan artikel ini yaitu Mas Doyok [Artikel terkait tampil di sidebar]. Dengan menambah gadget atau widgets anda.[lihat gambar menambah widgets]

dan masukkanlah kode script berikut ke widgets yang akan anda tempatkan tadi

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

simpan atau tambahkan dan selesai.

Agak njlimet ya cara membuat artikel terkait tampil disidebar ini, namun konon kalo ada widgets ini berguna untuk meningkatkan pageviews blog kita, entah kalo untuk SEO.
Salam…

Anak SMP

Pos ini dipublikasikan di Artikel Terkait, TIPS NGEBLOG. Tandai permalink.

42 Balasan ke Cara Membuat Artikel Terkait Tampil di Sidebar Blog

  1. Nyuns berkata:

    Gampang ya ternyata Bang😀, lain kali di coba, met sore bang buwel, lagi tidur ya😀

  2. Riska mbem berkata:

    bang, sudah di coba tapi kok ada yang ganjel ya?di edit HTML saya gak ada kode ini,padahal udah saya cari dgn F3

  3. alamendah berkata:

    (Maaf) izin mengamankan KEDUAX dulu. Boleh, kan?!Tutorialnya makin keren2. sayange rata2 khusus untuk blogspot, ya?hehehe

  4. Aulawi Ahmad berkata:

    wah ilmu baru lagi..tq🙂

  5. riFFrizz berkata:

    nice trick nie, tapi saya pakek wordpress nie

  6. TUKANG CoLoNG berkata:

    tapi kalo artikel terkaitnya lebih dari 2, penuh banget keliatannya meski udah pake scroll….:)

  7. genial berkata:

    makin maknyus nii bang… save dulu kodenya iia🙂

  8. rawins berkata:

    wah kirain cuman pake widget doang. rada males kalo harus utak atik html. suka eror. hahaha

  9. Dongkrak Antik berkata:

    salam kenal….blognya bagus ya…mas aku blog baru…mintak bimbingannya ya …biar blogku kayak pya e mas..tukeran liks ya mas..nanti aku pasang biar aku banyak teman…salam kenal dari dongkrak antik …kunjung balik ya

  10. sivi berkata:

    salam kenal..makasih bacaannya ya..blognya bagus..met puasa

  11. Fajar berkata:

    om…kalo mo bikin lingk blog..yang update gimana ya..

  12. Camajuyas berkata:

    iya om..bikin bloglist kaya punya om buwel itu gimana caranya ya om..he..he..mbok diajarin..

  13. catatan kecilku berkata:

    Pengen coba juga ah… Makasih banget ya sharingnya.

  14. the others... berkata:

    Maaf baru sempat mampir lagi…🙂

  15. kalo pake widget baru tu sama ya hasilwidget yg baru dikluarin blogger itu lho

  16. akhirnya kembali ke asal mas buwel mantap deh

  17. four dreams berkata:

    nanti aku coba deh sob :Dthank you yaaa

  18. aku lagi cari tips spt ini, Wel. tks ya. ntar kalo sempet aku coba deh.

  19. bluethunderheart berkata:

    wah makasih infonyasalam hangat dari blue

  20. penghuni60 berkata:

    terima ksh byk tipsnya…agak ribet jg ya kodenya

  21. yihaaaaaaaaaaaaangider sambil ngejar anak smp

  22. rosanakmami berkata:

    eh wow rajin banget euy buwel… :Oternyata bikin daftar yang nulis smp juga ya kayak bang atta*loh komennya gak nyambung?heheu… :pvmet hari selasa, buwelsemoga hari ini menyenangkan😀

  23. Ocky Fajzar berkata:

    wah blognya jadi blog tutor nih kayaknya hihihi kapan-kapan mau nyoba😀

  24. anak nelayan berkata:

    ilmu baru nih..nice info friend

  25. INFONYA TENTANG MASANG ARTIKEL. blom brani nyoba gua

  26. gua belum rani nyoba buat. tapi makasih dengan infonya

  27. belum brani nyoba gua.

  28. Skydrugz berkata:

    kayanya berubah total nih blog

  29. darahbiroe berkata:

    ok dechmakasih yawuntuk tips dan trik nya:D

  30. Mood berkata:

    Met malam pak, keren dan berguna nih artikelnya.

  31. Elvindinata berkata:

    wokeh sobat,,sip tutornyaa,,,, lagsung tekape aja dhe,,mau liat2 dulu,,:),,, slam kenal kawan,, happy blogging ^^

  32. Coba dulu ahhhh….🙂

  33. M. Faizi berkata:

    Kalau bikin labels/tag macam di BlOG Anda atau sejensinya itu gimana, ya? Biar rapi, tidak bersenarai ke bawah…

  34. Reny berkata:

    Makasi tips nya ya bang….Update lagi postingannya ya bank

  35. Yohan Wibisono berkata:

    Nice Article, inspiring. Aku juga suka nulis artikel bidang bisnis di blogku : http://www.yohanwibisono.com, silahkan kunjungi, mudah-mudahan bermanfaat. thx

  36. tutorial seo berkata:

    saya sudah pasang mas,.. ternyata gampang masangnya… makasih infonya

  37. hasan berkata:

    artikelnya bgs sob!!

  38. sekarang saya sudah menggunakan fitur ini dan sudah jalan sekitar 4 bulan…tapi berhubung sesuatu hal, saya ingin menghilangkan kembali widget ini.. kira2 gimana cara simplenya agar kode2 template saya bisa seperti awal sebelum di tambahkan kode2 widget ini?

  39. Julianti Purba berkata:

    makasih banyak bang ..infonya cukup membantu..

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s