Cara Membuat Widget Like Facebook Dan Follow Twitter Melayang Di Blog

Cara Membuat Widget Like Facebook Dan Follow Twitter Melayang Di Blog -  Selamat sore sobat  Firman Maulana Tgb, Beberapa jam yang lalu saya sudah mengeshare tentang Cara Membuat Tombol Like Di Bawah Postingan Blog dan kali ini akan saya share Cara Membuat Widget Like Facebook Dan Follow Twitter Melayang Di Blog, Memang sama dengan widget seperti umunya, Namun tempatnya yang berbeda kalau widget yang biasa tempatnya di samping kiri atau akan blog, tapi yang ini letaknya pada awal layar blog, Strategis bukan?? Banyak keuntungan penempatan widget di tempat ini. Contohnya : mudah dilihat dan tidak terlihat membosankan bagi para pengunjung.
Tertarik untuk membuatnya ?
Yuk ikuti langkah-langkah berikut :

1. Login Ke Blogger
2. Pilih Template
3. Tambahkan Gadget
4. Pilih HTML Java Script
    Copykan kode ini :

<style type='text/css'>
/* Message Box */
#box-message {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#fff;
font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
#box-message a.close {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:22px;
-moz-border-radius:22px;
border-radius:22px;
cursor:pointer;
}
#twitterx {
background: #EEF9FD;
padding: 10px;
text-align:center;
border: 1px solid #C7DBE2;
border-top: 0;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top Value When Page Loaded Completed
$('#box-message').animate({top:"50px"}, 1000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='box-message'>
<!-- HTML Start -->
<center><a class="murub">Like dulu sebelum baca</a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Firman-Maulana-Tgb/511276158904757&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false&amp;appId=371524026202784" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</center>
<!-- HTML End -->
<br/>
<div class="twitter">
<!-- Twitter --> <iframe title="" style="width: 250px; height: 20px;" class="twitterx-follow-button" src="http://platform.twitter.com/widgets/follow_button.html#_=1319978796351&amp; align=&amp;button=blue&amp;id=twitter_tweet_button_0&amp; lang=ID&amp;link_color=&amp;screen_name=firmantgb&amp;show_count=&amp; show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe> </div>
<a class='close' href='#'>&times;</a>
</div>

5. Ganti kode berwarna Biru Muda dengan URL Fanspage Facebook anda
6. Ganti kode berwarna Merah dengan ID Twitter anda
7. Klik Simpan

Regards,

Twitter                ( @firmantgb )
Facebook           ( Firman Maulana Tgb )