Home » » Tutorial Cara Membuat Related Post atau Artikel Terkait Blogspot

Tutorial Cara Membuat Related Post atau Artikel Terkait Blogspot

Baca Juga

Rating: 4.9
Bagaimana cara menambahkan Related post atau related post dalam blog? ikuti cara berikut ini: 


  1. Cari menu Layout Edit HTML di Dashboard blog anda.
  2. Back up Template template anda sebelum mengubah HTML untuk menjaga agar template bisa dikembalikan jika ada kesalahan! KlikDownload Full Template.
  3. Jangan lupa centang (tandai) "Expand Widget Templates".
  4. Carilah kode </head>
  5. Tambahkan kode dibawah ini persis sebelum </head> 
    <style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://sites.google.com/site/rhakateza/rss.png") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='https://sites.google.com/site/rhakateza/p/Related_posts.js' type='text/javascript'/>
  6.  Sekarang carilah <data:post.body/>. atau pada beberapa template sering dipakai kode <div class='post-body> atau<data:post.body/>
  7. Tambahkan kode berikut ini dibawah kode yang anda cari diatas:
  8. <b:if cond='data:blog.pageType == "item"'> <div id="related-posts"> <font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><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=5&quot;' type='text/javascript'/></b:if></b:loop> </font> <script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels(); </script> </div></b:if>
  9. Sekarang save template dan kita sudah selesai menambahkan widget related post pada blogspot.
  10. Tambahan: Untuk mengubah jumlah postingan yang tampil di Related Post, rubah angka max-result pada langkah ke 7 dengan jumlah post yang anda inginkan, contoh:
    max-result=7
    Semoga bermanfaat :) 

17 komentar:

  1. iya,,itu namnya related post ya,,sempat pengen nyari,,buat blog ku,,terima kasih gan

    ReplyDelete
  2. good article :)
    kunjungan balik ya gan :)

    ReplyDelete
  3. artikel yang menarik :)
    thanks infonya..
    saya baru tahu nih, hehehe

    ReplyDelete
  4. ah mau saya praktekin tapi artikel diatas tidak bisa dicopas,bagaimana saya masukin kodenya kalau gitu

    ReplyDelete
  5. @yangyang bisa di copas mas pakai keyboard ctrl+c

    ReplyDelete
  6. gan, ada cara buat related postnya ada gambar thumbnail nya ?

    ReplyDelete
  7. @hendru pake linkwithin aja

    ReplyDelete