Membuat Related Post Di Blog Pasti Berhasil

Alasan postingan kali ini saya berikan judul di atas adalah karena banyaknya artikel yang memuat cara memuat Related Post di Bloger namun kebanyakan script/kode yang dibagikan sudah/tidak valid. Sehingga hasilnya tidak bekerja bagi para sobat bloger. Nah berikut caranya membuat related post di blog sobat, 100% pasti berhasil. Sudah saya coba !!

1. Login ke Blogger

2. Buka Template => Edit HTML

3. Cari kode </head> dan letakkan kode di bawah ini di atas </head>

<!--Start Related Posts dengan thumbnails-->
<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;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
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:#d4eaf2;
}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqIyek0lj68ZMSH3bWn1XlfVdh911po_lv8rn6ztXb9ug76xcsz3-dvsEDIkxq1_uziiqJXkfapyzu7Ave5lCXb9Qd2IZ0rftXi2vgsBPpMBvIpDcC_QtaHXvOPGljrwuG-xSzXJBHSUk/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='http://hzndi.googlecode.com/files/related-posts-with-thumbnails-hzndi.js' type='text/javascript'/>
</b:if>
<!--End Related Posts dengan thumbnails akhiran disini-->

4. Sekarang cari kode ini <div class='post-footer-line post-footer-line-1'> ,
     jika sobat tidak dapat menemukan kode diatas cari kode ini <p class='post-footer-line post-footer-line-1'>.                Kemudian  Copas kode di bawah ini dan letakan di bawah salah satu kode di atas!!

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

<!-- remove --><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=6&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://hzndi.blogspot.com/2012/03/membuat-related-post-dengan-thumbnail.html'><img style="border: 0" alt="Related Posts Widget For Blogger with Thumbnails" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a><a href='http://bloggertemplates.bloggerplugins.org/' ><img style="border: 0" alt="Blogger Templates" src="http://image.bloggerplugins.org/blogger-templates.png" /></a>

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

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

Oke, selesai.

Oleh : Frandy Christian Pada hari Rabu, November 13, 2013

Tweet

Berlangganan artikel terbaru via Email