Cara Baru Membuat Artikel Terkait di Bawah Posting

Pemberitahuan!!

Mohon dengan sangat Untuk Tidak Melakukan Copy-Paste pada Artikel ini. Tindakan tersebut sangat dibenci oleh Blogger. Sehingga Jika Anda melakukan Co-Pas Artikel, kemungkinan besar Blog Anda akan TERHAPUS dari GOOGLE tanpa saya melapor kepada google DMCA. Sayangilah Blog Anda. Terima kasih.

Cara Baru Membuat Artikel Terkait di Bawah Posting

Cara mudah membuat related post -  Cara Baru Membuat Artikel Terkait dibawah Posting merupakan suatu cara baru yang harus kita terapkan pada blog yang kita punya jika dalam templete yang kita gunakan tidak ada related post / artikel terkait ini.

Fungsi dari memasang artikel terkait dalam setiap posting mempunyai pengaruh yang besar terhadap jumlah pageview setiap pengunjung. Bisa dibayangkan jika satu orang pengunjung blog anda membuka 2-4 artikel anda maka trafiik pun akan meningkat dan ini semakin membuat website / blog anda lebih disukai oleh search engine seperti google.

cara baru membuat related post atau artikel terkait

Jika anda tidak terlalu percaya dengan apa kata saya diatas, perhatikan sekarang dengan apa yang terjadi pada blog saya ini. Lihat pada widget Statistik Blog dan perhatikan aplikasi Histat saya yang menunjukkan counter Visitor dan Page View. Jika dihitung perbandingan antara keduanya adalah 1:4. sehingga dapat disimpulkan, pengunjung blog saya ini rata – rata membuka 4 halaman artikel setiap berkunjung. Tentunya selain artikel terkait yang saya pasang, saya juga Membuat Recent Post / Artikel yang terbaru saya terbitkan.

Jika anda tertarik ingin meningkatkan page view seperti saya tersebut, maka simak saja langkah dalam membuat artikel terkait dibawah ini karena sangat mudah dilakukan.

Cara membuat Related Post Artikel Terkait :


1. Login ke Akun Blog Anda, dalam hal ini blogger karena saya menggunakan blogspot

2. Klik Templete,  lalu pilih Edit HTML

3. Kemudian anda cari kode <data:post.body/>,
Gunaka CTRL+F agar pencarian lebih Mudah dan jika menemukan kode tersebut lebih dari satu, gunakan kode yang ke-2 dari atas, namun ada juga beberapa template yang berbeda penempatan kode post bodynya, jadi jika kode kedua tidak bisa, coba kode selanjutnya sampai yang terakhir


4. Copy-paste kode berikut ini di bawah kode <data:post.body/> yang sudah saya jelaskan pada point nomor 2

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p style='font-style:bold;'>ARTIKEL TERKAIT:</p>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:150px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 15;
maxNumberOfPostsPerLabel = 50;
maxNumberOfLabels = 3; function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type='text/javascript'>RelPost();</script>
</div>
</b:if>

5. Selanjutnya cari kode ]]></b:skin>


6. Copy-paste semua code berikut ini tepat diatasnya kode ]]></b:skin>

.rbbox{border: 1px solid #000000;padding: 5px;
background-color: #F2F2F2;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: #EFFBEF;}
.rbbox ul li {
display : block;
background : url(http://i1237.photobucket.com/albums/ff469/indolaron/icon/005.png) no-repeat 0px 0;
margin-left : -10px;
padding-top : 0;
padding-right : 0px;
padding-bottom : 1px;
padding-left : 20px;
margin-bottom : 5px;
line-height : 1em;
border-bottom:1px dotted #cccccc;}

7. Klik Save/Simpan Templete

KETERANGAN TAMBAHAN:
*ARTIKEL TERKAIT, = bisa diganti sesuai keinginan. misal: Related Post, Baca Juga, Read more ataupun yang lain terserah

*maxNumberOfPostsPerLabel = 50;  = jumlah posting atau artikel terkait yang ingin Anda tampilkan

*maxNumberOfLabels = 3;  = jumlah label terkait yang ingin ditampilkan

*background-color: #F2F2F2; = warna background kotakan artikel terkait dan bisa diganti sesuai selera

*background-color: #EFFBEF; = warna background saat kursor menyorot olom tersebut

*http://i1237.photobucket.com/albums/ff469/indolaron/icon/005.png = icon didepan link

Sekian yang bisa saya bagikan dari saya mengenai Cara Baru Membuat Artikel Terkait dibawah Posting  pada kesempatan kali ini. semoga membantu dan bermanfaat bagi anda semua. Saya ucapkan terima kasih karena sudah berkunjung ke blog yang sederhana ini.
Share this article :

87 komentar:

  1. Mas kalau cara membuat artikel terkait seperti yang anda pakai pada template ini bagaimana caranya membuatnya?

    ReplyDelete
    Replies
    1. nanti akan saya publikasikan sob, tapi jika tidak sabar menunggu, bisa search di google karena banyak tutorial nya

      Delete
  2. Replies
    1. Oh ya??
      Coba perhatikan peletakannya di data.post.body
      kalau tidak bisa yang kedua coba yang pertama ( tergantung banyaknya kode dalam templete anda )

      Delete
  3. Salam kenal mas...saya sdh coba utk artikel terkait ini dan ketika saya save kok jadinya kotak kosong aja ya dibawah postingan. yang saya inginkan ada gambar dan tulisannya. mohon pencerahannya mas. makasih

    ReplyDelete
    Replies
    1. Salam kenal juga, kalau kotak saja berarti itu masih loading, belum keluar.
      nanti yang akan keluar memang hanya tulisan mengenai artikel terkait saja. untuk artikel terkait dengan thumbnail, akan sata publikasikan jika ada kesempatan. anda bisa sabar menunggu atau langsung cari saja di google. karena sudah banyak yang sudah publikasikan mas.
      terima kasih

      Delete
  4. makasih gan berguna banget, kunjungi blog saya juga gan masih baru blognya ^_^

    ReplyDelete
  5. makasih juga atas tipsnya.. mau nyoba dulu ya sob...

    ReplyDelete
  6. berhasil mas, thanks ya n salam kenal

    ReplyDelete
  7. Harles Bayu Anggara = makasi jugaa.. waah mana blognya, gunakan Open id sob biar gampang saya kunbal
    Maz Brams, febrian x = makasi balik yaa.. silakan dicoba
    Ary Diery = Selamat sob. salam kenal juga dan salam buat keluarga dirumah

    ReplyDelete
  8. Makasih om, baru aja di bikin di blog baru saya..
    :D

    ReplyDelete
  9. Sangat membantu bro.
    sangat ingin menanti postingan terbaru lainnya yang bermanfaat untuk blogger pemula seperti saya ini.

    ReplyDelete
  10. Wah terimakasih ilmunya ya sangat bermanfaat banget lho...

    ReplyDelete
  11. Tutorialnya sangat berguna, terimakasih

    ReplyDelete
  12. tanpa nama, M Stokist Higoat Susu Kambing, Isanx Alisa = terima kasih kembali ya, jika berhasil warnanya akan berwarna hijau

    Eko Mulyadi = Oke, nanti akan saya bagikan lagi jika punya ilmu yang lain lagi

    ReplyDelete
  13. Makasih gan,,,, nice info.... ane coba...
    salam kenal..

    ReplyDelete
    Replies
    1. salam kenal juga gan, silakan semoga berhasil langsung

      Delete
  14. Kok belum bisa juga ya mas, saya udah coba beberapa kali, belum berhasil juga

    ReplyDelete
    Replies
    1. pada data post body setiap templete berbeda beda, kalau pakai otomatis jump break biasanya di data post body yang kedua..
      tapi untuk yang lain bisa di yang kedua ketiga atau malah yang pertama

      kuncinya coba dulu dibeberapa datapostbody yang lain..
      jangan terpaku di nomor 2

      Delete
  15. Replies
    1. yang bagian mana errornya?? ini scriptnya tidak saya rubah kok biasanya memang lama kalau postnya banyak, atur aja nilai postnya sedikit dahulu

      Delete
  16. wah nginfo yang mudah di pahami Mas...makasih and sukses selalu.

    ReplyDelete
    Replies
    1. Sama sama, semoga langsung bisa ya dipraktekkan

      Delete
  17. tidak bekerja pada template saya mas, sudah saya coba di ke 2

    ReplyDelete
    Replies
    1. oh ya? mungkin templete mas rido terlalu besar. saya nanti akan update untuk artikel terkait yang menggunakan kode script templete responsive

      Delete
  18. gan laporrrrr.... berhasillll.......maksih ya gan,,,

    ReplyDelete
  19. ini yang ane cari..thanks dah berbagi info nya,dan sudah di terapkan di blog saya berhasil

    ReplyDelete
    Replies
    1. mantap dah blog agan kadut, semoga tampilannya semakin menarik

      Delete
  20. mas bro tks banget yah atas tutornya sdh saya coba di blog saya www.cyberarmy13.blogspot.com ternyata berhasil. saya pemula dlm duni blog mas. sekali lagi tks ya mas bro. klo ada waktu mohon koreksi blog saya ya mas dan mohon masukannya. terima kasih

    ReplyDelete
    Replies
    1. nanti kalau saya da wktu akan berkunjung, makasi kembali dan selamat atas keberhasilannya menerapkan cara baru saya :D

      Delete
  21. Thanks cara nya. kunjung balik ya :D

    ReplyDelete
  22. sob sy cari kode tdk ketemu ya,knapa tuh???template sy default blogger

    ReplyDelete
  23. kotak artikel terkait nya kosong gan berapa lama jika ane memiliki 161 post?

    ReplyDelete
    Replies
    1. diatur saja mas muhammad, jangan banyak banyak cukup 5 aja di artikel terkait

      Delete
  24. wah, kok gak work mas, terimakasih sebelumnya...

    ReplyDelete
    Replies
    1. wahyu = yang semangat sob.. Faiz = coba tanda < dan > dihilangkan aja waktu cari di ctrl+f
      Asyrof = Coba copy lagi kodenya, lalu pastikan datapostbodynya sesuai karena dalam templete biasanya lebih dari 1 kode tersebut

      Delete
  25. saya sudah coba artikel artikel sebelah tentang cara buat artikel terkait
    dan gak aada yang manjur
    disini saya langsung coba,ternyata cesspleng
    makasihhh gannnnn

    ReplyDelete
  26. biasanya susah ya mau pasang related post nya di blog.. gua coba y gan... siapa tau berhasil...

    ReplyDelete
    Replies
    1. eri yanto = makasi mas uda mencoba.. peri= silakan mas, pasti berhasil kok, kalau tidak, berarti blognya terlalu berat

      Delete
  27. . saya sudah coba artikel artikel sebelah tentang cara buat artikel terkait
    dan gak aada yang manjur
    disini saya langsung coba,ternyata cesspleng
    makasihhh gannnnn

    ReplyDelete
    Replies
    1. terima kasih mas wahyu kalau berhasil dengan cepat :D

      Delete
  28. informasinya bermanfaat, makasih mas

    ReplyDelete
  29. Mas saya sudah mencoba berulang kali turtor di atas tapi tetap saja tidak bisa mas,Tolong pencerahannya

    ReplyDelete
    Replies
    1. Perhatikan poin no 3 mas restu, jika pada templete anda menemukan banyak kode itu, maka pilih yang kedua.. namun jika belum berhasil, silakan dicoba di kode yang lain

      Delete
  30. mas andie,,, mau tanya niii,,, script ini berlakuuntukblog iklan baris gak kebetulan lagi nggarap blog iklan baris niiih?? mhn infonya , kalo boleh email ke amalbis07@gmail.com trims

    ReplyDelete
  31. siip, dah jdi akhirnya stelah nyoba 2 kali. tpi cara ganti warna tulisan linknya gimana ya?

    ReplyDelete
    Replies
    1. itu bawaan settingan blogger / templete nya sob

      Delete
    2. klo letak Artikel Terkaitnya biar dibawah tombol share gimana y?

      Delete
    3. yang seperti di blog saya ya sob, lihat saja di inspeksi laman jika nada menggunakan firefox, nanti kode yang muncul dicari di edit templetenya..

      Delete
  32. mas andie, saya ga menemukan kodenya, tolongin

    ReplyDelete
    Replies
    1. coba cari kode "/b:skin" saja mas agus, tanpa tanda petik ya

      Delete
  33. mas...artikel terkait sudah muncul...tapi linknya ga bisa di klik

    ReplyDelete
    Replies
    1. oh ya?? masak sih? saya cek dulu soalnya biasanya uda bisa kok gan

      Delete
  34. kalau ganti artikel terkait yang bawaan dari template gimana gan caranya ?

    ReplyDelete
    Replies
    1. artikel terkait bawaan templete tidak ada jika itu dari blogger. cuma ada artikel terbaru dan terpopuler saja. kalau sobat nano download templete gratis, biasanya disediakan kodenya jika memang mendukung artikel terkait dalam templete tersebut

      Delete
  35. Mas Andie mohon bantuannya cara naruh related post di bawah kolom share. Aku udah nyoba sana sini tp blm berhasil, termasuk saran Mas Andie untuk lihat Inspeksi Elemen. Udah berhasil di bawah TOMBOL share tp masih masuk dalam KOLOM/KOTAK share. Aku pengennya yg pisah dari kolom sharenya kayak di blog ini.
    Makasih banyak sebelumnya mas

    ReplyDelete
    Replies
    1. berarti pindah dibawahnya lagi sob.. biasanya kode tersebut dipisah dengan /div jadi cari dulu dibawahnya

      Delete
  36. makasih mas, saya coba ya
    ohyamas, tanya, tapi sedikit diluar topik
    tahu nggak caranya pasang link di tengah-tengah postingan secara otomatis

    ReplyDelete
    Replies
    1. link ditengah? bukannya cuma pakai center aja ya..

      Delete
  37. Pagi Mas Andie, saran Anda sudah saya terapkan. Awalnya berhasil dan ARtikel terkait pada kolom scrollnya muncul. Namun kenapa bisa hilang scrollnya? Seperti kasus Ni Ketut Suriastini, S.Sn. yang tampak kotak kosong saja. Apa perlu waktu bagi situs/blogger untuk menetapkan itu menjadi "permanen"? Sekarang "Artikel Terkait" saya jadi kosong. Mohon bantuannya. Terima kasih sebelumnya.

    ReplyDelete
    Replies
    1. itu berarti template yang ada di blog terlalu berat gan.. makanya loading lama

      Delete
  38. Terima kasih min.
    Saya ingin menambahkan bahwa untuk langkah yang ke 3,"" nya tidak selalu yang kode yang ke-2 dari, soalnya saya sudah mencoba di blog saya dan saya meenggunakan kode terakhir.

    ReplyDelete
    Replies
    1. Oke akan saya revisi.. terima kasih masukkannya yang bermanfaat ini.

      Delete
  39. terima kasih atas sarnnya..., salam kenal dari saya

    ReplyDelete
  40. maksih infonya.salam kenal.q msih baru ni.

    ReplyDelete
  41. Sangat Membantu Tema, salam kenal n silahkan berkunjung

    ReplyDelete
    Replies
    1. salam kenal juga wajak, terima kasih atas kunjungannya

      Delete
  42. saya udah coba yang mas sarankan. dan muncul kotak Artikel Terkait. masalahnya kok kotaknya kosong. cara ngisinya gimana mas?

    ReplyDelete
    Replies
    1. artikel total di blog agan emangnya uda berjumlah berapa?

      Delete

Terima Kasih sudah berkunjung,
Berkomentarlah sesuai dengan yang dibahas dan Jangan Memasukkan LINK yaaa..

Salam Berbagi..

 
Support : Google
Copyright © 2013. Cara Baru Andie - All Rights Reserved
Template Created by Creating Website Published by Kompi Ajaib
Proudly powered by Blogger