Cara Membuat Related Post Dengan Thumbnails

Pada postingan saya sebelumnya, saya menulis artikel tentang mencari uang dengan hanya membaca email dan mengklik ads saja. Kali ini saya akan menulis arikel tentang cara membuat related post dengan thumbnails, tapi sebelumnya saya mau menginformasikan kepada pemabca, jika anda membeli perangkat telekomunikasi, sebaiknya yang sudah di sertifikasi atau sudah mendapatkan sertifikat resmi dari postel, untuk menjaga agar tidak terjadi hal-hal yang tidak di inginkan. Dan perangkat yang sudah di sertifikasi tentunya sudah teruji di Balai Besar Pengujian Perangkat Telekomunikasi sehingga mutu dan kualitas perangkat tejamin.

Kembali kepokok bahasan, menambahkan related post atau artikel yang terkait pada setiap postingan dapat meningkatkan trafik kunjungan blog anda. Pengunjung akan mudah menemukan dan membaca artikel-artikel terkait pada blog anda. Lebh menariknya lagi related post ini disertai dengan gambar. Cara membuat related post dengan thumbnails adalah sebagai berikut.

• Login pada blogger.
• Klik Layout pada Dasboard.
• Klik Edit HTML pada Layout dan jangan lupa centang Expand Widget Template
• Cari code

</head>

• Dan ganti kode tersebut dengan kode dibawah ini.

<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond="'data:blog.pageType">
<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 src="'http://blogergadgets.googlecode.com/files/relatedthumbs19.js'" type="'text/javascript'/">
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
</head>

• Selanjutnya temukan kode
  

<div class='post-footer-line post-footer-line-1'>

atau bila tidak ditemukan, cari kode seperti dibawah ini

<p class="'post-footer-line">

• Letakkan kode berikut setelah kode pada langkah 6
  

<!-- Related Posts with Thumbnails Code Start-->
<b:if cond="'data:blog.pageType">
<div id="'related-posts'">
<b:loop values="'data:post.labels'" var="'label'">
<b:if cond="'data:label.isLast">
</b:if>
<b:if cond="'data:blog.pageType">
<script src="'&quot;/feeds/posts/default/-/&quot;" alt="json-in-script&amp;callback="related_results_labels_thumbs&amp;max-results="6&quot;'" type="'text/javascript'/"></b:if></b:loop><a href="'http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html'" style="'display:none;'">Related Posts with thumbnails for blogger</a><a href="'http://www.bloggerplugins.org/'" style="'display:none;'">blogger widgets</a>
<script type="'text/javascript'">
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle="Related Posts";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style="'clear:both'/">
</b:if>
<!-- Related Posts with Thumbnails Code End-->

• Untuk menampilkan jumlah post dapat diedit dengan mengganti angka pada

var maxresults=5;.

• Untuk mengganti nama "Related Post" dengan "Artikel Yang Terkait" dapat diganti pada

var relatedpoststitle="Related Posts";

Demikian informasi dari saya tentang cara membuat related post dengan thumbnails yang dapat saya sampaikan, semoga berguna dan dapat menambah pengetahuan anda.