Membuat Artikel Terkait Dengan Animasi Gambar Bergerak

Berikut langkah Membuat Artikel Terkait Dengan Animasi Gambar Bergerak
1. Login ke Blogger.
2. Pilih Templates 
3. Klik Edit HTML
4. Backup dulu template untuk jaga-jaga kalau ada yang salah 
5. Beri tanda centang pada kotak kecil dekat Expand Template Widget
6. Gunakan F3 untuk mencari kode </head>
7. Kalau sudah dapat lalu letakkan kode dibawah ini tepat diatas kode </head>
 <!--Related Posts mari-berbagi244.blogspot.com 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: #ff6565;
    font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
    margin-bottom: 0.75em;
    margin-top: 0em;
    padding-top: 0em;
    }
    #related-posts a{
    color:#ff6565;
    }
    #related-posts a:hover{
    color:#ff6565;
    }
    #related-posts a:hover {
    background-color:#eeeeee;
    }
    </style>
    <script src='http://my-project-favicon.googlecode.com/files/relatedposts.js.txt' type='text/javascript'/>
    </b:if>
    <!--Related Posts mari-berbagi244.blogspot.com Styles End-->
 8. Langkah selanjutnya cari kode seperti di bawah ini :
 <div class='post-header-line-1'/>
    </div>
<b:if cond='data:blog.metaDescription == &quot;&quot;'>
      <!-- Then use the post body as the schema.org description,
          for good G+/FB snippeting. -->
      <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='description articleBody'>

 9. Lalu letakkan kode dibawah ini tepat dibawahnya

<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>Produk Lainnya : </b></h3>
<marquee behavior='alternate' direction='left' height='220' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='3' width='auto'>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=8;
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://chillaolshop.blogspot.com/' style='display:none;'/>
</b:if>
</b:if>


10.  Klik save dan lihat hasilnya

Keterangan :
1. var maxresults=8; merupakan artikel terkait yang akan ditampilkan, silahkan anda ubah
2. Produk Lainnya dapat di rubah sesuai dengan keinginan.

Tidak ada komentar:

Posting Komentar