Cara Buat jQuery Scroll Bar Social Bookmark Bergulir

1. Buka akun blogger Anda
2. Masuk ke menu Template > Edit HTML > Proceed > edit HTML > centang Expand Template Widget
3. Cari kode dibawah ini :

<b:includable id='post' var='post'>

    4.  Pastekan kode dibawah ini dibawah pada kode diatas :

<!--Start Sticky Bar Code http://www.spiceupyourblog.com-->

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div id='share-buttons'><div class='twitter scount'> <a class='twitter-share-button' data-count='vertical' data-via='NAMA_PENGGUNA-TWITTER' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></div><div class='facebook scount'><iframe allowTransparency='true' expr:src='&quot;//www.facebook.com/plugins/like.php?href=&quot; + data:blog.url + &quot;&amp;amp;send=false&amp;amp;layout=box_count&amp;amp;width=80&amp;amp;show_faces=false&amp;amp;action=like&amp;amp;colorscheme=light&amp;amp;font=arial&amp;amp;height=90&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:80px; height:90px;'/></div><div class='stumble scount'><script src='http://www.stumbleupon.com/hostedbadge.php?s=5'/></div><div class='gplus scount'> <script src='https://apis.google.com/js/plusone.js' type='text/javascript'/><g:plusone size='tall'/> </div><center><a class='pin-it-button' count-layout='vertical' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a>

<a href='javascript:void(run_pinmarklet())' style='margin-left:-46px; width:43px; height:20px; display:inline-block;'/>

<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/>

<script type='text/javascript'>

function run_pinmarklet() {

var e=document.createElement(&#39;script&#39;);

e.setAttribute(&#39;type&#39;,&#39;text/javascript&#39;);

e.setAttribute(&#39;charset&#39;,&#39;UTF-8&#39;);

e.setAttribute(&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.random()*99999999);

document.body.appendChild(e);

}

</script> </center><br/><a href='http://feeds.feedburner.com/blogspot/frupz' rel='nofollow' target='_blank' title='Subscribe To Our Rss Feed'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0XHWuC6JkR3e5HRdWkXFFUS0jPoFX8nVaXrJ2ykh4k6NNe0spm7dIW_kYI0gz_q0VL2rScE1RnobOTzpo-4TKd0vdTHpk7-j1PH9Xi5jiUVsby_VdPR6nkbU1dEYuoPdxkc9NkaHhrnI/s1600/rss-seat.png'/></a>

<br/><a href='http://www.spiceupyourblog.com/2012/05/jquery-scroll-bar-social-bookmark.html' target='_blank' title='Get This Scrolling Bookmark Gadget For Blogger'><small>Get Gadget</small></a></div></b:if>

<!--End Sticky Bar Code http://d-copy.blogspot.com-->

Keterangan :

• Ganti NAMA_PENGGUNA-TWITTER dengan nama pengguna Twitter Anda
• Ganti blogspot/frupz dengan nama pengguna Feed Burner Anda

    5.  Cari kode dibawah ini :

]]></b:skin>

    6.  Pastekan kode dibawah ini, diatas pada kode diatas :

/*Start Sticky Bar Css http://d-copy.blogspot.com*/
#share-buttons {
background: none repeat scroll 0 0 #fff;
border: 1px solid #CCCCCC;
left: -80px;
padding: 8px;
position: absolute;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-goog-ms-border-radius: 6px;
border-radius: 6px;
}
#share-buttons .scount{
clear: both;
display: block;
margin: 2px auto;
text-align: center;
width: 55px;z-index:-1;
}
.facebook.sbutton .fb_ltr{width:40px !important;}
.post-outer{height:auto;}
#main{position:relative;}
#main-wrapper{position:relative;}
/*End Sticky Bar Css http://d-copy.blogspot.com*/

   7.  Cari kode dibawah ini :

</head>

   8.   Pastekan kode dibawah ini, dibawah pada kode diatas :

<!--Start FB Code http://d-copy.blogspot.com-->
<div id='fb-root'/>
<script>
(function() {
var e = document.createElement(&#39;script&#39;);
e.src = document.location.protocol + &#39;//connect.facebook.net/en_US/all.js#xfbml=1&#39;;
e.async = true;
document.getElementById(&#39;fb-root&#39;).appendChild(e);
}());
</script>
<!--End FB Code http://d-copy.blogspot.com-->

   9.  Preview dan Save Template Anda.

Keterangan :

• Jangan lakukan modifikasi pada kode.
• Gadget akan bekerja atau hanya bekerja di postingan bukan di home page.

Sumbernya disini : http://adf.ly/JlyU7