"Preview : Floating Share Button" |
Floating disini maksudnya ibarat mengikuti atau terbang ... (Helehhh... Apa yang benar ni ? ) Atau coba lihat aja sebuah tombol sebelah kiri blog saya terdapat berbagai macam tombol, itulah share button yang di fasilitasi dengan efek floating. Untuk lebih jelas lihat gambar diatas.
Bagaimana ? Berminat, jika ia silahkan ikuti tutorial berikut.
Pertama-tama copy kode di bawah ini :
<style>
#pageshare {position:fixed; bottom:15%; margin-left:-71px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<div id="pageshare" title="Get this from khamardos.blogspot.com">
<div class="sbutton" id="fb">
<a href="http://www.facebook.com/sharer.php" name="fb_share" type="box_count">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript">
</script></div>
<div class="sbutton" id="rt">
<script src="http://tweetmeme.com/i/scripts/button.js" type="text/javascript">
</script></div>
<div class="sbutton" id="gb">
<a class="google-buzz-button" data-button-style="normal-count" href="http://www.google.com/buzz/post" title="post on google buzz">
<script src="http://www.google.com/buzz/api/button.js" type="text/javascript">
</script>
</a></div>
<div class="sbutton" id="gplusone">
<script src="http://apis.google.com/js/plusone.js" type="text/javascript">
</script>
<g:plusone size="tall"></g:plusone></div>
</div>
- Setelah itu dari Dashboard -> Rancangan
- Klik Add a Gadget -> HTML/JAVASCRIPT
- Letakkan kode yang sudah anda copy tadi di form HTML/JAVASCRIPT tersebut
- Lalu Save.
Mudahkan sobat ? Iya, sampai disana aja tutorialnya. O y jangan lupa +1 nya sobat, dan kalau bisa share artikel ini kepada teman-temanmu yang ada di Facebook, Twitter dll ya sobat... Thanks ...
.:: HAPPY BLOGGING SOBAT ::.
12 comments:
:: Nice info Sob, ntar kapan2 ane coba...^_^
perkongsian yang baik!
keeren kang.. suatu saat pasti tak coba... ctrl + D dulu kang :)
Pagerank update minor, soalnya ada yg naik ada yg nggak blogku, klo share,aku lebih suka pake bawaan blogspot yg udh selalian ada +1 jadi males nambah2 script hhe...
sip thx share ilmunya om :D
Thanks..abah dah cuba buat
wow,,, its very good article... thanks for sharing. I blog down a page rank, that the page rank 3 a page rank 2
thank
kalo yg wp gimana Sob?
d coba ach,..
makasih infonya,,!!!
jiah,,pake java script emang lebih mudah mau langsung saya pakai ya gan,,oya buat button lintas berita gimana tuh??
kok yg muncul cuma google+ sama facebook. untuk munculin twitter gimana gan?
:: Komentar Anda ::
Kritik dan Saran yang membangun sangat saya harapkan dari sobat semua !!!
:) :( :X =(( :-o :-/ :-* :|
8-} ~x( :-t b-( :-L x( =))
[[ Form Komentar Klasik ]]