Biasanya
Related Post atau artikel terkait ini termasuk kedalam katagori atau label yang ada di
blog.
Cara Membuat Related Post Dengan Gambar Berjalan - Related post banyak macamnya ada yang memakai kotak tanpa ada gambar, ada juga yang berupa tulisan judul saja. Nah sekarang kita akan mencoba Membuat Related Post Dengan Gambar Berjalan, maksud disini adalah menampilkan Related Post dengan memakai gambar dan bergerak dari kanan kekiri. untuk lebih jelasnya silahkan anda peraktekan sendiri.
1. Login ke Blogger dengan menggunakan akun anda
2. Lalu masuk ke Rancangan
3. Lalu Edit HTML
4. Centang Expand Template Widget
5. Jangan lupa untuk mendownload dulu template anda. dan kalau ada kesalahan bisa dikembalikan kesemula
6. Kemudian cari kode </head> (untuk mempermudah pencarian silahkan tekan CTRL + F pada keyboard)
7. Copy kode dibawah ini dan letakan tepat diatas kode </head>
<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == "item"'>
<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: #585858;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:#FFFFCC;
}
#related-posts a:hover{
color:#000000;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://sundaboy.googlecode.com/files/relatet%20post.txt' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
8. Selanjutnya cari lagi kode yang mirip dengan kode dibawah ini
<div class='post-footer-line post-footer-line-1'>
9. Lalu Copy dan pastekan kode dibawah ini tepat dibawah kode diatas
<!-- Marquee Serbablog Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=12"' type='text/javascript'/></b:if></b:loop>
<h3><b>
Artikel Terkait</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="<data:post.url/>";
var maxresults=
8;
var relatedpoststitle="";
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'>
</b:if>
</b:if>
<!-- Marquee Nobi Related Posts with Thumbnails Code End-->
10. Simpan template dan lihat hasilnya
Catatan :
Tulisan yang berwarna "
Artikel Terkait" yang
berwarna merah diatas bisa anda ganti dengan kata-kata lain
Angka 8 merupakan jumlah artikel terkait yang akan ditampilkan, anda bisa merubahnya sesuai keinginan anda.
Judul : Cara Membuat Related Post Dengan Gambar Berjalan
Deskripsi : Cara Membuat Related Post Dengan Gambar Berjalan - Related post atau artikel terkait yang ada disebuah website atau blog berguna agar supa...