Membuat Fanspage Facebook dan Follow Twitter melayang di blog

|OneszAccess| - Ya sesuai dengan judul diatas, pada kesempatan kali ini saya akan memeberikan tutorial kepada sahabat blogger tentang Bagaimana cara untuk membut fanspage facebook dan button follow twitter di blog?. Ya seperti terlihat pada blog saya ini, nanti hasilnya kira-kira seperti ini:

Widget ini merupakan salah satu widget untuk memberikan respon pengunjung terhadap apa yang kita tulis diblog, jika pengunjung merasa terbantu dengan artikel/tulisan yang kita buat maka secara otomatis dia akan mengklik like atau follow secara sukarela tanpa paksaan apapun hehe..

Widget ini juga sebagai salah satu alternatif widget yang bisa membantu sobat mengurangi widget yang telah berjejer di sidebar. Ok kita langsung menuju ke inti tulisannya.

Langkah-langkahnya adalah:

1. Buka Dasbor Blog
2. Pilih Tata Letak - Tambahkan Gedget
3. Pilih HTML/Java Scrit
4. Pastekan Kode Scrit Dibawah 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">Kalau Bermanfaat,Silahkan Dilke Ia</a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/OneszAccessCorporationInc?ref=hl&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=oneszaccess&amp;show_count=&amp; show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe> </div>
<a class='close' href='#'>&times;</a>
</div>

Ganti Tulisan Kalau Bermanfaat,Silahkan Dilke Ia dengan kata-kata sobat sendiri
Ganti Tulisan https://www.facebook.com/OneszAccessCorporationInc dengan url fanspage sobat
Ganti Tulisan oneszaccess dengan username twitter (contoh: @oneszaccess menjadi oneszaccess)

Sekian semoga bermanfatt..
Have FUN