Membuat Related Post Dengan Gambar Bergerak

     Membuat Related Post Dengan Gambar Bergerak - Mungkin beberapa dari para blogger udah gak asing lagi dengan tutorial yang satu ini, atau mungkin bagi para blogger yang menggunakan template di luar template yang blogger sediakan atau dengan kata lain mendownload template dari situs-situs tertentu mungkin beberapa dari template tersebut sudah terdapat related post nya, namun tidak ada salahnya saya berbagi tutorial yang satu ini, sekalian anda bisa sedikit mempelajari kode HTML. Berikut langkah-langkahnya ;

• Login terlebih dahulu ke akun blogger anda
• Pilih Template - Edit HTML - Lanjutkan
• Jangan lupa untuk mencentang Expand Tempalte Widget
• Letakkan kode berikut di atas kode </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://blogergadgets.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/> </b:if> <!--Related Posts with thumbnails Scripts and Styles End-->

Gunakan Ctrl+F untuk mempermudah pencarian

• Carilah kode berikut

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

jika tidak ada, cari kode berikut ini

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

• Letakkan kode berikut di atas nya

<!-- Marquee Hajsmy Blog 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://www.hajsmy.co.cc/2011/06/cara-membuat-related-post-thumbnails.html' style='display:none;'>Thumbnail Related Post</a> <a href='http://www.hajsmy.co.cc/' style='display:none;'>blogger tutorials</a> </b:if> </b:if> <!-- Marquee Hajsmy Blog Related Posts with Thumbnails Code End-->

• Simpan dan Lihat Hasilnya