Cara Membuat Floating Share Button Di Blog New Update
Cara Membuat Floating Share Button Di
Blog New Update - Sobat Blogger kembali saya share tips dan trik
blogger blogspot terbaru . Posting ini sangat berkaitan dengan postingku
terdahulu yakni Cara
Pasang Faceook Share Button di Blog
, tapi kali ini dalam postingku yang terbaru ini saya sedikit memberikan
script dimana share button ini akan
melayang (floating share) .Bedanya kalau tombol share melayang ini hanya
untuk berbagi artikel ke 4 layanan social
bookmark saja yaitu share
artikel ke Facebook, Twitter, Google Buzz dan Google Plus One ( +1 ).
OK sobat
langsung saja nih cara memasang share button melayang di blog :
1.
Login ke dashboard blogger anda.
2.
Pilih TataLetak > Elemen Laman > Add gadget
(HTML/JavaScript).
3.
Copy script dibawah ini dan paste kedalam kotak HTML/JavaScript tersebut
tadi.
<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 code from rayhanzhampiet.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>
4.
Save / Simpan.
Sangat mudahkan?
Simple and fast….
Salam Blogger
dan Selamat Berkreasi!!
1 comment
- Top comments
- Newest first