Maaf ya rada lama posting’y coz gie sbuk2 ma kuliah, n
ini bru kesempatan buat update posting yang di tanyain oleh salah satu sobat
blogger, walapun saya masih newbie di bidang blogger, saya coba untuk membantu
sobat blogger semampunya..
To the point
aja yach...
Related posts memang menjadi salah satu alternatif sobat
blogger buat menampilkan posting2 sebebelumnya tapi related posts tersebuat
akan jauh lebih menarik jika di ikut sertakan dengan gambar untuk menarik
perhatian pengunjung, tapi kadang kala related posts tersebut tidak bisa
menampilkan seluruh posts kita sebelumnya, maka di perlukan marquee agar bisa
menampilkan seluruh posts secara bergantia.
Seperti gambar di bawah ini :
Nah,
untuk memulainya :
1.
Pertama, masuk dulu ke halaman Edit HTML, jangan lupa
memberi tanda centang pada "Expand Widget Templates".
2.
Cari kode ini </head>
3.
Kemudian ganti
dengan kode dibawah ini
<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: black;
font-family: Georgia, “Times New Roman”, 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-->
</head>
4.
Setelah sobat terapkan poin pertama
diatas, sekarang silakan cari code ini :
<div
class='post-footer-line post-footer-line-1'>
Atau
<p
class='post-footer-line post-footer-line-1'>
5.
Jika
sudah ketemu salah satu code diatas, letakkan code dibawah ini setelah salah
satu code 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>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="<data:post.url/>";
var maxresults=10;
var relatedpoststitle="";
<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>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="<data:post.url/>";
var maxresults=10;
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'>
<a
href='http://serba-seru.blogspot.com/2010/02/thumbnail-related-posting-with
marquee.html'
style='display:none;'>Thumbnail Related Post</a>
<a
href='http://www.bloggerplugins.org/' style='display:none;'>blogger
tutorials</a>
</b:if>
</b:if>
<!-- Marquee Serbablog Related Posts with Thumbnails Code End-->
</b:if>
<!-- Marquee Serbablog Related Posts with Thumbnails Code End-->
6.
Simpan
dan lihat hasilnya
Ket :
·
Untuk
menampilkan jumlah postingan, sobat bisa merubah code yang berwarna biru.
·
Untuk
mengganti title, sobat bisa merubah code yang berwarna ungu
