Wednesday, March 14, 2012

Pasang Floating Share Button Di Blog.

Share Button atau yang sering kali kita sebut Tombol Bagi, merupakan salah satu cara agar user atau pengunjung blog kita dapat lebih mudah membagikan content blog kita ke berbagai situs jejaring favorit mereka. Dengan seperti ini tentu saja ini akan membantu menjaring pengunjung yang lebih banyak ke blog kita.
Perlu kita ketahui, SEO optimizen bukan hanya dengan cara melakukan Submit URL, dan lain sebagainya, ini juga salah satu langkah agar kita mendapatkan pengunjung yang lebih banyak.
Oke kita mulai saja ya, tidak usah banyak cing cong...haha..!!

Langkah pertama yang harus kita lakukan tentu saja Login ke Akun Blogger. kemudian masuk ke menu rancangan, pilih yang elemen laman atau kalau bahasa inggrisnya Page Element..hehe! Nah, kalau sudah tambahkan gadget, pilih yang HTML/Javascript, Copy paste Code Berikut :


<!--Floating Share Button Widget Start-->

<style>

#pageshare {position:fixed; bottom:15%; right:10px; float:left; border: 3px dotted green; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#d26607;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;-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="Share This With Your Friends">
<div class='sbutton' id='gb'><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class='sbutton' id='rt'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></div>
<div class='sbutton' id='gplusone'><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class='sbutton' id='digg' style='margin-left:3px;width:48px'><script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script><a class="DiggThisButton DiggMedium"></a></div>
<div class='sbutton' id='fb'><a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script></div><br/></div>
<div class='sbutton'><a href="http://blog-thinker.blogspot.com/2012/03/pasang-floating-share-button-di-blog.html">Get This One</a><br/></div>
<!--Floating Share Button Widget End-->


kemudian Save.
SELESAI.

Untuk merubah tampilan warna maupun posisi, silahkan edit sendiri CSS nya.
Semoga Bermanfaat.

6 comments:

Anonymous said...

Nice Post Gan...!!!

Silmi Salsabila said...

makasih ya.. :D
jadi tau caranya

Admin said...

@Silmi Salsabila Sama-sama...

Tv Online paling Lengkap said...

di pojok kiri ada facebook, view 19 jam tadi via firefox,... gimana cara buatnya mas (comment balik di blog saya yach,trims )

KSB said...

Nice Post Gan,
Di Coba Dulu Di Blog Sy.
Salam Kenal Ya gan

Unknown said...

makasih gan....dah tak coba.berhasil kuk.....

Post a Comment

:) :(;):D;;-):-/:x:P:-*=((:-OX(:7B-):-S#:-S7:):((:)):|/:)=))O:-):-B=;I-)8-|L-):-a:-$[-(:O)8-}2:-P(:|=P~:-?#-o=D7:-SS@-):^o:-w7:P2):):-c:)]~X(:-h:-t8-7X_X:!!m/:-q:-bd^#(^Blog Thinker