Membuat related post blog otomatis

Posted by Unknown on Sabtu, 26 Mei 2012 0

Cerdaskom tips blog: Hallo rekan blogger, pada saat ini cerdaskom akan berbagi tips membuat related post blog otomatis dibawah artikel sesusai dengan label (lihat gambar dibawah ini)

Related posts adalah kumpulan link yang diletakkan persis dibawah artikel sehingga menarik minat pembaca untuk membaca artikel berikutnya

Bermanfaat untuk memancing pengunjung

Cerdaskom sudah mengemas codingnya dalam javascript sehingga codingnya jadi lebih ringkas. So mari kita langsung ke cara membuat nya:
1, Seperti biasa masuk ke blogmu
2. Pilih template, klik edit html dan klik lanjutkan
3. Ceklist pada Expand Template Widget (jangan lupa simpan template aslinya buat jaga-jaga)
4. Cari kode: </head> (gunakan Ctrl+f untuk mencari)
5. Copy kode dibawah ini tepat diatas </head>

<style> #related-posts { float : left; width : auto; 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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRHhgV5oUIhjSl_jvEn4L9rznvJGA0BQfbdYlbB53BTzBZT22BcLwd88t1zxsXHtyknBjYMO8itbu51hsascoIdmTcZUno_cY_hLiQ_cj7ZXbjbb0pwTIZD9UgbLSXZpskNMEk6KbB0s1f/s1600/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='http://widget-related-post.googlecode.com/files/related-post.js' type='text/javascript'/>

6. Cari kode <data:post.body/> atau <div class='post-body>, Kemudian copy code dibawah ini, letakkan persis dibawahnya

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

7. Klik pratinjau (preview) untuk memastikan tidak terjadi error.
8. Simpan hasilnya.

Selamat mencoba, salam dari cerdaskom!