Cara Membuat Widget Share Melayang

                    Cara Membuat Widget Share Melayang Terbaru!

muhibnuervikhan.blogspot.com

Cara Membuat Widget Share Melayang Terbaru! - Selamat pagi teman-teman setia Pelajar Blogger yang selalu berkunjung disini. Tadi malam, saya sudah memostingkan artikel tentang Blog yaitu  Cara Membuat Efek Zoom Pada Gambar Di Blog untuk memperindah dan mempercantik Blog anda. Dan kali ini saya akan memosting lagi ( Horeeeeeeee!! ) tentang Blog yang berjudulkaaaaannnnnnnnnn....... taraaaaa Cara Membuat Widget Share Melayang Terbaru!

Cara Membuat Widget Share Melayang Terbaru! - Widget share ya apa itu widget share? Widget share merupakan sebuah widget yang berfungsi untuk membagikan sebuah postingan yang ada pada suatu Blog, jadi jika ada pengujung sedang membaca sebuah postingan di Blog anda dan menurut dia postingan itu bermanfaat, maka pengujung tersebut akan membagikannya kepada teman-teman Facebook, Twitter, dll pada widget share itu. Tetapi disini, saya kan memberikan widget share yang melayang. Gimana? Keren kan? Jika anda ingin melihat demo dari hasil tutorial ini, perhatikan gambar dibawah ini!

Widget Share Melayang

Lihatlah lingkaran warna merah pada gambar diatas! Itulah hasilnya dari tutorial ini. Apakah anda tertarik untuk memasangnya di Blog anda? Jika anda tertarik silahkan simak tutorial Cara Membuat Widget Share Melayang Terbaru! dibawah ini :

1. Loggin ke Blog.

2. Menuju Tata Letak lalu Add Gadget.

3. Pilih Javascript/HTML

4. Letakan kode dibawah ini.

<!--Widget Share Button Melayang Start-->
<style>
#pageshare {position:fixed; bottom:0%; right:5px; float:left; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#eff3fa;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="bagikan ke teman anda">
<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='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></div>
<!--Widget Share Button Melayang End-->

5. Jika sudah, silahkan klik simpan.

6. Jika ingin mengatur tempatnya, silahkan edit sendiri.