Cara Menambahkan Widget Related Posts


Berikut Cara Menambahkan Widget Related Posts:

1. Masuk ke dashboard blogger, klik Template, klik Edit HTML.

2. Klik di mana saja pada area kode, tekan Ctrl + F, akan muncul kotak pencarian.

3. Copy dan paste kode berikut di kotak pencarian, kemudian tekan Enter:


</head>

4. Copy dan paste kode berikut di atas kode  </head>:


<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts{float:left;width:auto;}
#related-posts a{border-right: 1px dotted #eaeaea;}
#related-posts a:hover{background: #EEEEEE;}
#related-posts h2{margin-top: 10px;background:none;font:18px Oswald;padding:3px;color:#999999; text-transform:uppercase;}
#related-posts .related_img {margin:5px;border:2px solid #f2f2f2;width:110px;height:100px;transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;-moz-transition:all 300ms ease-in-out;-o-transition:all 300ms ease-in-out;-ms-transition:all 300ms ease-in-out;-webkit-border-radius: 5px;  -moz-border-radius: 5px; border-radius: 5px; }
#related-title {color:#666;text-align:center;padding: 0px 5px 10px;font-size:12px;width:110px; height: 40px;}
#related-posts .related_img:hover{border:2px solid #E8E8E8;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;-khtml-opacity:.7}</style>
<script type='text/javascript' src='http://helplogger.googlecode.com/svn/trunk/relatedposts.js' />
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

5. Copy dan paste kode berikut di kotak pencarian, kemudian tekan Enter:

<b:includable id='postQuickEdit' var='post'>

Di atas  <b:includable id='postQuickEdit' var='post'> ada kode <b:includable>

6. Copy dan paste kode berikut di atas <b:includable>:

 <!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=5&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=4;
var relatedpoststitle=&quot;<b>Related Posts:</b>&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div class='clear'/><div style="font-size: 9px;float: right; margin: 5px;"><a  style="font-size: 9px; text-decoration: none;" href="http://helplogger.blogspot.com/2012/03/how-to-add-related-posts-widget-to.html" rel="nofollow" >Related Posts Widget</a></div>
</b:if>
<!-- Related Posts with Thumbnails Code End-->

7. Klik Format Template dan Simpan Template.

Contoh related posts;



Demikian info Cara Menambahkan Widget Related Posts, semoga bermanfaat bagi anda.

Komentar

Postingan populer dari blog ini

Persyaratan Permohonan Perizinan di Kota Depok

Sekolah Wirausaha Muslim Seri # 1

Ustadz Felix Siauw: Untukmu Wahai Saudaraku, HTI, PKS, dan Salafi

Percepatan Pendidikan yang Merata dan Berkualitas

Cara Ekspor Blog dari Wordpress ke Blogger

Ketika Aisyah Tak Diberi Segelas Air Putih Oleh Rasulullah

Allah Dulu, Allah Lagi, Allah Terus ; Bersiap Untuk Akhirat tulisan Yusuf Mansur dan Arifin Ilham

1 Ramadhan 1436 H Bertepatan dengan 18 Juni 2015

Cara Membuat Read More Otomatis