membuat sticky bar dengan recent posts

Edit HTML

Ganti kode ]]></b:skin>, dengan kode berikut :

#latesthack-stickybar{background:#000000 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpranp4xime7FiCO277DhuKkqVUw-IMWsPNYX9tdve0q_ymzoCvJL-C9zViunpNMa8ExnDQ1kdIeDvzdYHVb1ZOK-2NXt_I_Z30VcjwkdNpXKZFAb7E5s5E9ISMplndQodGb_SqgyCBgU/s1600/stickybar.png') repeat-x;width:100%;margin:0 auto;text-align:center;padding:0px 0;top:0px;color:#F40045;border-bottom:2px solid #000;/*box-shadow*/-webkit-box-shadow:#666666 0px 1px 3px;-moz-box-shadow:#666666 0px 1px 3px;box-shadow:#666666 0px 1px 3px;z-index:999;display:none;height:28px;position:absolute;line-height:1.85em;vertical-align:baseline;letter-spacing:1px;}
#latesthack-stickybar a{text-decoration:none;color:#FFFFFF;font-size:13px;font-weight:bold;font-family:arial,"Helvetica",sans-serif;line-height:24px;}
#latesthack-stickybar a:hover{text-decoration:underline;}
#latesthack-stickybar p{margin:0;list-style:none;}
#latesthack-stickybar img{vertical-align:middle;margin-right:6px;}
#latesthackclose{padding:0px;float:right;cursor:hand;cursor:pointer;color:#ddd!important;}
]]></b:skin>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script src="http://latesthack.googlecode.com/svn/branches/stylishstickybar/stickybar.js"></script>
<script src="http://latesthack.googlecode.com/svn/branches/stylishstickybar/latesthackstickybar1.js"></script>


Dibawah kode <body>, letakkan kode berikut :
<div id='latesthack-stickybar'>
<script>
var nMaxPosts = 10;var nWidth = 95;var nScrollDelay = 100;var sDirection = "left";var sOpenLinkLocation = "N";var sBulletChar = ">>";
</script>
<script src="http://ketawalucu.blogspot.com/feeds/posts/default?alt=json-in-script&amp;callback=RecentPostsScrollerv2&amp;max-results=10 " >
</script>
<a href="#" id="latesthackclose"  onclick="return false;">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitCYzBnYCrwZB5QwEJMd63AOs3qADb21e7nWilat0ugOKwit8VHBoM3ZSbvK2iiYD0OHwaWJPveJHUgOzl9p1sAuckhkoBda9tfQ5yCBHnFPujceuRchiKh6wDa2F-bZ-vLFi_zBimO4Q/s1600/cancel.png"/>
</a>
</div>


  • Ganti http://ketawalucu.blogspot.com/ dengan URL blog Anda.
  • var nMaxPosts = 10 adalah jumlah post yang akan ditampilkan
  • nScrollDelay = 100 adalah kecepatan jalannya Recent post
  • Kalau Anda ingin mengganti arah dari Recent Post yang jalan tinggal ganti left menjadi right.