Jumat, 02 Desember 2011

Membuat Related Post With Thumbnails di Bawah Postingan

Lihat gambar di bawah, ini yang di maksud Related Post With Thumbnails di Bawah Postingan, klik image untuk memperbesar.
Tutorial Blog

Membuat Related Post With Thumbnails di Bawah Postingan tidaklah begitu rumit hanya sedikit Edit HTML dan selesai, jika anda tertarik menggunakan-nya di Blog silahkan ikuti petunjuk di bawah ini.

1. Log in ke account blogger anda.
2. Klik "Design" lalu "Edit HTML".
3. Centang "Expand Template Widget", lalu Download full template ini cara agar menjaga-jaga anda dalam melakukan kesalahan.
4. Cari kode </head> dan Copy kode di bawah ini lalu Paste tepat di atas </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: 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://galang.googlecode.com/files/relatedposts.js' type='text/javascript'/></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

5. Setelah itu cari kode <div class='post-footer-line post-footer-line-1'>, lalu Copy kode di bawah ini tepat di bawah kode <div class='post-footer-line post-footer-line-1'>.

<!-- 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='100%'>
    <script type='text/javascript'>
    var currentposturl=&quot;<data:post.url/>&quot;;
    var maxresults=10;
    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://celoteh-galang.blogspot.com/2011/04/membuat-artikel-terkait-thumbnails.html' style='display:none;'>Thumbnail Related Post</a>
    </b:if>
    </b:if>
    <!-- Marquee Serbablog Related Posts with Thumbnails Code End-->

6. Save template anda dan lihat hasilnya.

THANKS SUDAH BACA ARTIKELNYA SEMOGA BERMANFAAT
ISI KOMENTARNYA YAH :)

0 komentar:

Posting Komentar

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | cheap international calls