Celoteh Sang Galang

Blog Tempat Berbagi Tips dan Trik Dunia Blogger
English French German Spain Italian Dutch Russian Brazil Japanese Korean Arabic Chinese Simplified
Celoteh Sang Galang
Hanya Sebuah Catatan...
Daftar Sekarang Bonus $10 langsung dari PROFITCLICKING

Kemarin baru saja saya memposting bagaimana Cara Membuat Artikel Terkait Dengan Thumbnails dan hari ini saya akan Membuat Artikel Terkait Thumbnails Disertai Marquee(Bergerak) yang bisa berjalan kesamping sehingga dapat menghemat tempat di blog kita. Selain itu pula artikel terkait yang ditampilkan bisa dimuat banyak.Contohnya bisa anda lihat Disini.

Cara Membuat Artikel Terkait Bergambar Berjalan
1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Rancangan.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Cari kode </head>
6. Taruh (copy paste) kode berikut ini di atasnya :

<!--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-->

7. Lalu 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) kode berikut ini di bawah salah satu kode di atas (no.7)

<!-- 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-->

Keterangan
Kita juga dapat menganti beberapa kode css, seperti berikut ini:
var maxresults=10;   --> Berarti artikel terkait yang akan kita tampilkan adalah 10
Related Posts bisa anda rubah menjadi Artikel Terkait atau kata-kata yang anda inginkan

Sekian Terima Kasih

GET UPDATE ARTIKEL MENARIK CELOTEH GALANG
Dapatkan kiriman artikel terbaru langsung ke email anda!

Artikel Terkait:

  1. Ini dia yang aku cari..
    Nyoba dulu sob

     
  2. Galang Says:
  3. @GStarCreation:ok kawan....

     
  4. BinTa Says:
  5. berankat

     
  6. Toya Says:
  7. sip gan infonya... makasiih..

     
  8. Admin Says:
  9. Thanks Bro...

     
  10. gan mau tanya gimana cara membuat readmore secara otomatis terus dibelakang pemotongan ada ..... mohon pencerahannya gan

     
  11. Rudy Hartono Says:
  12. makasih infonya sangat membantu sekali untuk yang belum pasang, nice share and happy blogging

     
  13. azzam10 Says:
  14. sip banget infonya kunjungi balik ya....

     
  15. Gusari Iman Says:
  16. Assalamualaikum.
    Saya ngeblog via HP Nokia 5230 dan Alhamdulillah berhasil artikel terkaitnya, sudah berbulan-bulan saya coba tapi gk pernah berhasil, tapi setelah berkunjung disini baru dapat yang saya inginkan, terimakasih banyak ya saudara.

    Syukron layanan menarik, jangan lupa kunjungi saya sob.

     
  17. thanks gan infonya..

    cukup membantu..

    kunjungan balik di The FIM Site

     
  18. mystericinta Says:
  19. ijin praktek sob

     
  20. Aulia MP Says:
  21. izin untuk mencoba sob, trims buat tutornya..

     

Posting Komentar


close