Cara Membuat Related Post Bergambar

bagaimana cara membuat related post? nah, buruan deh baca artikelnya dibawah, good luck!!


Oke to the Point,Caranya cukup simpel Petama masukkan kode berikut tepat diatas kode </head>:

<!-- Cob22.Blogspot.Com Related Posts with thumbnails Scripts and Styles Start-->

<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>

<style type='text/css'>

#related-posts {

float:center;

text-transform:none;

height:100%;

min-height:100%;

padding-top:5px;

padding-left:5px;

font-size

}

#related-posts h2{

font-size: 1.4em;

font-weight: bold;

color: black;

font-family: Georgia;

margin-bottom: 0.75em;

margin-top: 0em;

padding-top: 0em;

}

#related-posts a{

color:black;

}

#related-posts a:hover{

color:black;

}

#related-posts a:hover {

background-color:#E0F8E0;

}

</style>

<script type='text/javascript'>

var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic3ccwTDkK1w8ks3rQumwV89w3LkdrUl-J87Nb0LsUut0QsV7iz6BWp1vgtShe5vjoKQkVpxTsbs0qwbWdLkKQ7YdPeSGTCmasz6yoRqnNm5VpORi_7cpibiVhSMFxiAXGuXBcW6R0n1E/s400/noimage.png&quot;;

var maxresults=5;

var splittercolor=&quot;#d4eaf2&quot;;

var relatedpoststitle=&quot;&quot;;

</script>

<script src='http://javascriptbtsnts.googlecode.com/files/btsnts-related-posts004.js' type='text/javascript'/>

<!-- remove --></b:if>

<!--Cob22.Blogspot.ComRelated Posts with thumbnails Scripts and Styles End-->

Next Step:Silahkan Centang Dulu Expand Widget Templates,Lalu Cari kode berikut <div class='post-header-line-1'/> Atau
<div class='post-body entry-content'>
Paste kode dibawah ini tepat di bawah kode tersebut:

<!-- Related Posts with Thumbnails Code Start-->

<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>

<div id='related-posts'>

<h2>Baca Juga Artikel lainya dari Informasi Hlaap!!</h2>

<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=7&quot;' type='text/javascript'/></b:loop>

<script type='text/javascript'>

removeRelatedDuplicates_thumbs();

printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);

</script>

</div><div style='clear:both'/>

<!-- remove --></b:if>

<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>

<a href='http://www.helperblogger.com/2012/01/related-posts-widget-with-thumbnail-for_22.html'><img alt='Related Posts Widget For Blogger with Thumbnails' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAPbHxzfVAeiFwuuLwYGBfpKkbNwvVBKJ_6MKuv4VvyBgRpOWsFC04_pG9KVtz2evTsJV8MqFSgo4ubK567fe_OgxZjKhVbwflpFiBFl2gnuW8ffQAuMCy_8C6sPO8NRvZvs1pLsZI4Z8/h120/hepler-blogger-related-posts.png' style='border: 0'/></a><a href='http://helperblogger.com/'><img alt='Blogger Tutorials' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0L9vxkQBhJyoOaCkP3UejXJ4CCt14K_uosaANZ3M7aspHDjWqdZ7TK-PMyUgbTPolZAVUm65fc5myGuxowdE6-WAU6nI-TOnKr277qiU_r9ah1Cha9yrnqGTkMFVzWIVGazc9iQBeZOU/h120/helper-blogger-related-posts1.png' style='border: 0'/></a>

</b:if></b:if>

<!-- Related Posts with Thumbnails Code End-->

Semoga bermanfaat