Kali ini Blog Gado Gado akan menampilkan artikel berjudul Cara Buat jQuery Scroll Bar Social Bookmark Bergulir. Dengan artikel Cara Buat jQuery Scroll Bar Social Bookmark Bergulir ini kami berharap dapat menjadi sebuah rujukan dan bahan penambah wawasan kita terkait dengan judul tersebut. Artikel ini adalah hasil pencarian di google dengan kata kunci Cara Buat jQuery Scroll Bar Social Bookmark Bergulir kemudian saya kumpulkan dan saya sajikan buat anda di Blog Gado Gado ini. Semoga kehadiran artikel ini bermanfaat bagi kita semua.anda juga dapat melihat artikel sebelumnya atau artikel berikutnya. Ok, langsung saja berikut adalah artikel Cara Buat jQuery Scroll Bar Social Bookmark Bergulir selengkapnya:
D-Copy Blog's | Tutorial paling diminta selama beberapa bulan terakhir telah ada untuk tombol fixed bergulir yang tampil di samping postingan dan bergulir ke halaman bawah dan dengan gadget reader. Gadget ini sangat populer di semua blog dan benar-benar membantu meningkatkan jumlah postingan Anda memalalui share Twitter, Facebook dan jQuery networks. Sosial yang digunakan lainnya kami lampirkan dengan bar ke samping posting blog Anda dan dengan tombol bookmark. Ini akan membuat halaman bar menjadi rapi dan memberikan pembaca memilih untuk berbagi di setiap gadget time. Saya telah menggunakan untuk beberapa bulan terakhir dan saya berhasil membuat 'share' dengan Anda hari ini dan memiliki pilihan berikut, seperti : Tweet, Facebook, Stumble Upon, Google+, Pin Pinterest dan penggunaan icon lainnya.
Langkah :
- Buka akun blogger Anda
- Masuk ke menu Template > Edit HTML > Proceed > edit HTML > centang Expand Template Widget
- Cari kode dibawah ini :
<b:includable id='post' var='post'>4. Pastekan kode dibawah ini dibawah pada kode diatas :Keterangan :<!--Start Sticky Bar Code http://www.spiceupyourblog.com--><b:if cond='data:blog.pageType == "item"'><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='"//www.facebook.com/plugins/like.php?href=" + data:blog.url + "&amp;send=false&amp;layout=box_count&amp;width=80&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font=arial&amp;height=90"' 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='"http://pinterest.com/pin/create/button/?url=" + 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('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r=' + 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/AVvXsEhbdVo3wcq-OaKts8re9jz5356toaEGrSM5LRAaPWUmgl2hruLAcFijA_771Ut_C4KhgwOzWodgYGBjupsHx0kA94sbQ4Jcl8MPWhw7kMHEPygfeUe5-3KWT4GJ8FWAQ3uPwrnztQmuDHI/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-->
- 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*/7. Cari kode dibawah ini :
#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*/</head>8. Pastekan kode dibawah ini, dibawah pada kode diatas :<!--Start FB Code http://d-copy.blogspot.com-->9. Preview dan Save Template Anda.
<div id='fb-root'/>
<script>
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js#xfbml=1';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<!--End FB Code http://d-copy.blogspot.com-->
Keterangan :
- Jangan lakukan modifikasi pada kode.
- Gadget akan bekerja atau hanya bekerja di postingan bukan di home page.
Nah, sobat Blog Gado Gado.. Anda telah membaca seluruh artikel berjudul Cara Buat jQuery Scroll Bar Social Bookmark Bergulir dengan keword yang masuk Blogger Hack , Blogger Widget . Anda dapat memberikan komentar ditempat yang telah tersedia. Terima kasih kunjungan Anda.
0 komentar:
Posting Komentar