Labels

Rabu, 22 Agustus 2012

Cara Membuat Artikel Terkait/Related Post


Memasang artikel terkait atau related post di bawah postingan blog kita adalah hal penting mengingat pembaca akan dengan mudah betah berkunjung ke blog kita karena informasi yang mereka butuhkan selanjutnya bisa mereka temukan di artikel terkait/related post.

Berikut cara membuatnya :
  • Login ke Dashboard --> Layout --> Edit HTML 
  • Centang "Expand Widget Templates"
  • Cari kode : </head> 
  • Copy dan Paste kode di bawah ini SEBELUM </head>.

<!--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;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Verdana, 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="http://1.bp.blogspot.com/_u4gySN2ZgqE/SosvnavWq0I/AAAAAAAAArk/yL95WlyTqr0/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='http://bloggergadgets.googlecode.com/files/related_posts_with_thumbnails_min.js' type='text/javascript'/>

<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

Langkah berikutnya,, cari kode
<div class='post-footer-line post-footer-line-1'>
atau ctrl+f dan paste kode di atas di kotak pencarian!

Dan tambahkan kode dibawah ini tepat di atas kode <div class='post-footer-line post-footer-line-1'>


<!-- Related Posts with Thumbnails Code Start-->
<!-- 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://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.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>
<!-- Related Posts with Thumbnails Code End-->

cari kode:
  • var maxresults=5; (ubah menjadi 7 atau berapa aja untuk menentukan jumlah artikel terkait)
  • var relatedpoststitle="Related Posts"; (Ubah judulnya bisa dengan baca selengkapnya atau continue reading, atau sesuka hati aja)

Tidak ada komentar:

Posting Komentar

Google Ping My page rank Ping O-matic Pingonat