Jumat, 11 April 2014

Cara Membuat Related Post di Bawah Postingan


Siang Sobat Blog Margatama, maaf kalau selama ini sempat menghilang dari dunia blog. Dikarenakan sibuk dengan urusan di dunia nyata T^T. Oke kali ini saya akan memaparkan Cara Membuat Related Post di Bawah Postingan. Untuk contohnya kurang lebih seperti yang di bawah postingan ini.

Oke langsung saja ikuti step di bawah ini.

Step :
1. Login ke blogger.
2. Klik Template > Edit HTML
3. Cari code </head> (untuk mempermudah bisa menggunakan ctrl + F)
4. Letakan code di bawah ini di atas code </head> tadi.
<style>#related-posts { float : left; width : 96%; margin-top:-30px; margin-left : 5px; font : 11px Verdana; margin-bottom:10px; font-family: &#39;Segoe UI Light&#39;, &#39;Open Sans&#39;, Verdana, Arial, Helvetica, sans-serif;}
#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; color:#222; }
#related-posts a:hover { text-decoration : none; color:#8fdcff; }
#related-posts ul { border : medium none; margin : 10px; padding : 0; }
#related-posts ul li { display : block; background : url(&quot;http://i.imgur.com/406i2yi.png&quot;) 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 solid #ddd; }</style><script src='http://goo.gl/5c6uTS' type='text/javascript'/>
5. Selanjutnya, cari lagi kode ini <data:post.body/>
6. Letakan code di bawah ini di atas code <data:post.body/>
kalau di Blog Margatama diletakan di bawah code <div class='post-footer-line post-footer-line-1'> jadi tergantung template blog kalian.
<br/><br/><b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<font size='3'><b style='color:#222;'>Related Posts : </b></font>
<font color='#222'><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 Simpan template.

Semoga Bermanfaat ^_^
Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

Tidak ada komentar