Cara Memasang Artikel Terkait atau Related Post di BLog

Sahabat semua, kali ini kita akan membuat bagaimana setiap artikel yang kita bikin saling terkait atau yang sering dikenal dengan related post, maksudnya setelah orang membaca artikel kita sampai ke bagian bawah, akan melihat artikel lainya. Sehingga dapat memudahkan pembaca menuju artikel yang lainnya. Jadi, saya berikan judul artikel kali ini dengan judul Cara Memasang Artikel Terkait atau Related Post di Blog.

Oke, langsung aja ya...ikuti langkah berikut bagaimana:

Langkah 1

Login terus ke halaman dashboard > Template > Edit HTML

Langkah 2

Letakkan kode berikut tepat di atas kode </head>

kode anda

<!--Awal Kode Related Posts-->

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

margin-top: 20px;

}

#related-posts .widget{

padding-left:6px;

margin-bottom:10px;

}

#related-posts .widget h2, #related-posts h2{

font-size: 17px;

font-weight: normal;

color: black;

font-family: Arial Narrow;

margin-bottom: 0.75em;

padding-top: 0em;

}

#related-posts a{

font-size:16px;

color: #555555;

font-variant:small-caps;

}

#related-posts a:hover{

text-decoration: none;

color: #ffffff;

font-weight: bold;

}

#related-posts ul{

list-style-type:none;

margin:0 0 0px 0;

padding:0px;

text-decoration:none;

text-color:#000000

}

#related-posts ul li{

list-style-type: none;

border-left: 2px solid #1399CF;

border-bottom: 1px dotted #1399CF;

margin-bottom: 3px;

padding-left: 30px;

padding-top:0px;

}

#related-posts ul li:hover{

background-color: #1399CF;

border-left: 2px solid #B3CA3D;

border-bottom: 1px dotted #B3CA3D;

}

</style>

<script type='text/javascript'>

var relatedpoststitle=&quot;Related Posts&quot;;

</script>

<script src='http://the-kampoeng-blogger.googlecode.com/files/relatedpostsederhana.js' type='text/javascript'/>

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

<!--Akhir kode Related Post--> 

Langkah 3

Letakkan kode berikut tepat di atas kode <div class='post-footer'>

NagariBlogger <!-- Awal Kode Related Post-->
    <!--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> <b:if cond='data:blog.pageType == &quot;item&quot;'> <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop>

    <script type='text/javascript'> var maxresults=5; removeRelatedDuplicates(); printRelatedLabels(&quot;<data:post.url/>&quot;); </script> </div> <!--Remove--></b:if> <!-- Akhir Kode Related Post-->

   

Catatan: Sahabat bisa mengganti kode yang berwarna biru sesuai dengan keinginan, trus kode ini  maxresults=5 boleh sahabat ganti berapa artikel terkait lainnya yang ingin ditampilkan.

Langkah 4

Silahkan diklik Save Template.

Nah..sekarang udah siap deh, coba liat hasilnya ya... Semoga bermanfaat. Wassalam.

Cara Memasang Artikel Terkait atau Related Post di BLog 2014-04-16T02:35:00+07:00 Rating: 4.5 Diposkan Oleh: galeri