Membuat Like Facebook Twiter Melayang di Blog

nah lo gw post lgi.. :v :v post kali ini mungkin akan berguna.. :v karena banyak yg tanya buat box like fb+twiter sama gw jadi yaa gw share aja tutornya.. siapa tau berguna..hmm.. widget ini memang akan memberatkan blog.. jadi kira" aja yaa klo blognya rame dgn widget mending gk usah pke ini karena akan beratin blognya..langsung saja ya.. but.. ini SS widgetnya:
:3 awas ada gambar.... :v

cara membuatnya:
1. loggin blogger
2. tata letak
3. tambahkan widget
4. HTML/Java script
5. masukkan script berikut didalam kolom yg disediakan.. :v
<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">Jangan Lupa Like ya</a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/MemeDenimIndonesia&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=MuamarRizky2&amp;show_count=&amp; show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe> </div>
<a class=close href=#>&times;</a>
</div>

*warna merah ganti dengan URL FP mu
*warna biru ganti dengan ID twitermu .. :v

nah" semoga bermanfaat..
atur" aja sesuka kalian..
jangan lupa komentarnya yaa... :D hahahaha.. :v

Posting Komentar