cara membuat like box facebook dan twiter di blog

By sartono 23 May, 2013

Assalamualaykum sahabat, Alhamdulillah setelah dua tips yang lalu admin membahas tentang seo tentang cara mendapat baclink dari web terbaik di mata google dan cara mudah merampingkan alexa dengan cepat dan mudah,Dan untuk pertemuan kali ini admin ingin berbagi tips tentang cara membuat cara menambahkan facebook blog.

Bagaimana caranya, Oh iya untuk demonya sahabat bisa lihat like box yang admin pakai pada blog sederhana admin ini,Untuk caranya sangat sederhana sahabat hanya menambahkan code di html/javascript
Ok kita menuju tkp ya sahabat.

Bagaimana caranya membuat like box facebook

Pertama sahabat login di akun blog sobat,Setelah sahabat masuk dasbor sobat pilih Tata Letak,Kemudian click tambahkan gadget, Kemudian sahabat cari / pilih Html/javascript.
hingga seperti gambar di bawah ini:

Selanjutnya sobat copy code di bawah ini dan pastekan di area konten seperti gambar di atas.

<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'>

<center><a class="murub">Jangan Lupa Like ya sahabat</a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/Tips-Blogger-dan-Computer/240673399395615?ref=hl&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&appId=371524026202784" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</center>

<br/>
<div class="twitter">
 <iframe title="" style="width: 250px; height: 20px;" class="twitterx-follow-button" src="http://platform.twitter.com/widgets/follow_button.html#_=1319978796351& align=&button=blue&id=twitter_tweet_button_0& lang=ID&link_color=&screen_name=sartonowadowo&show_count=& show_screen_name=&text_color=" frameborder="0" scrolling="no"></iframe> </div>
<a class='close' href='#'>×</a>
</div>

Seperti yang kita lihat ada 3 warna yang admin tandai di code like box.

Untuk yang berwarna merah sahabat bisa ganti dengan kata-kata yang sahabat inginkan.
Yang berwana kuning sahabat ganti dengan code like box facebook sahabat.
Dan yang terakhir warna unggu ganti dengan nama akun twiter sahabat.

Mungkin itu yang bisa admin bagikan cara menambahkan facebook di blog pada kesempatan kali ini,Mudah-mudahan bermanfaat dan ahir coretan wassalam.