Cara Membuat Artikel Terkait Disertai Thumbnails Pada Blogspot

Posted by : Unknown - Posted On : 3/29/2012 with : 12 Comments

Cara Membuat Artikel Terkait Disertai Thumbnails Pada Blogspot. Artikel Terkait Disertai Thumbnails Pada Blogspot atau mungkin artikel yang berhubungan, atau sejenisnya sangat penting sekali. Kenapa demikian, visitor akan dimudahkan untuk mengelilingi (surfing) blog kita.

Membuat Artikel Terkait Disertai Thumbnails Pada Blogspot ini merupakan salah satu tips untuk menaikkan page view pada blog. Artikel terkait ini akan tampil dengan Thumbnails disertai Judul Postingan kita.

Cara Membuat Artikel Terkait Disertai Thumbnails Pada Blogspot :

1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Tata Letak.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Cari kode </head>
6. Copy paste Script berikut ini di atasnya

<b:if cond='data:blog.pageType == "item"'>
    <style type='text/css'>
    #related-posts*{
    float:center;
    text-transform:none;
    height:60%;
    min-height:60%;
    padding-top:5px;
    padding-left:5px;
    }
    #related-posts h2{
    font-size: 1.5em;
    font-weight: bold;
    color: black;
    font-family: Georgia, “Times New Roman”, 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/AVvXsEgS3X4luJx6YhnrZ-xlXECPkzqZYowMp4UpzpZjLEEo60VnlHBaDXJ8PjognyURNCGhS1rERbwyL4lQ2K81cOswa57w4Ez8R90QMvZDox2nCPQcfTOWVVKOh1yGi8STVGBDvWcpQLHIx6jz/s1600/No+Image.jpg";
    var maxresults=6;
    var splittercolor="#000000";
    var relatedpoststitle="Artikel Terkait:";
    </script>
    <script src='http://related-post-05.googlecode.com/files/Related-Post.js' type='text/javascript'/>
    </b:if>

7. Cari kode di bawah ini

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

Atau jika tidak menemukannya cari kode berikut ini

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

8. Jika sudah ketemu, taruh Copy Paste Script berikut ini di bawah salah satu kode di atas (no.7)

<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=9"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
</b:if>

8. Kalau sudah selesai jangan lupa klik save template
9. Selesai.

Catatan:

Jumlah artikel terkait / label

var maxresults=6;

Judul artikel terkait

max-results=9

var relatedpoststitle="Artikel Terkait";

Warna tulisan pada artikel yang terkait, silahkan diganti sesuai keinginan.

var splittercolor="#d4eaf2";

Artikel Terkait Disertai Thumbnails Pada Blogspot ini hanya muncul pada halaman posting, jika ingin Artikel Terkait Disertai Thumbnails Pada Blogspot ini muncul di semua halaman blog, kita bisa menghapus kode