Ads (728x90)

Recent Post adalah widget yang akan menampilkan beberapa artikel / postingan terakhir blog. Adapun jumlah portingan yang di tampilkan bisa diatur sesuai keinginan kita dengan mengacak - acak kode HTMLnya. Dengan Related Post Thmbnails ini, pengunjung akan dengan mudah melihat beberapa artikel terakhir yang diposting di blog. Dengan sekali klik, pengunjung akan langsung menuju ke artikel yang masih fresh.


  • Login ke Blogger.
  • Di halaman Dasbor, kita pilih Rancangan.
  • Kemudian pilih Edit HTML
  • Beri tanda centang pada Expand Template Widget
  • Cari kode </head>
  • Copy kode di bawah ini dan paste di atasnya </head>
    <!--Related Posts with thumbnails Scripts and Styles Start-->
    <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: lucida grande, &#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:#cfe2f3;
    }

    </style>
    <script src='http://wanadry.googlecode.com/files/related-posts-thumbnail.js' type='text/javascript'/>
    </b:if>
    <!--Related Posts with thumbnails Scripts and Styles End-->

    Trus 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'>

    Kalau sudah ketemu copy code dibawah ini dan pastekan kode dibawah salah satu kode di atas yang anda temukan.

    <!-- Marquee Serbablog Related Posts with Thumbnails Code Start-->
    <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_thumbs&amp;max-results=12&quot;' type='text/javascript'/></b:if></b:loop>
    <h3><b>Related Posts</b></h3>
    <marquee align='center' behavior='alternate' direction='left' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='600'>
    <script type='text/javascript'>
    var currentposturl=&quot;<data:post.url/>&quot;;
    var maxresults=6;
    var relatedpoststitle=&quot;&quot;;
    removeRelatedDuplicates_thumbs();
    printRelatedLabels_thumbs();
    </script></marquee>
    </div><div style='clear:both'/>
    </b:if>
    <b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
    <a href='http://referensidunia.blogspot.com/2010/01/membuat-artikel-terkait-dengan-disertai.html' style='display:none;'>Thumbnail Related Post</a>
    <a href='http://referensidunia.blogspot.com/search/label/Blogging Tips' style='display:none;'>blogger tutorials</a>
    </b:if>
    </b:if>
    <!-- Marquee Serbablog Related Posts with Thumbnails Code End-->
  • Langkah terakhir yaitu save template.

Selamat mencoba.

Poskan Komentar

Blogger