Cara Mudah Membuat Like Box Facebok Melayang di Blog Terbaru

Sebelumnya cara ini sudah ada untk yang blum tau bisa di cek di sini .....

Sebuah Blog akan terlihat lebih mapan dan akan menarik minat sang pembaca jika kita berbagi postingan kita ke sosial media seperti Google+ Twitter dan Facebook
bicara soal Facebook ini sangat berguna dan sangat bermanfaat untuk blog kita, kita bisa membuat halaman facebook lalu menempatkannya di blog kita agar pembaca bisa lebih mudah mengetahui blog kita, dengan menggunakan widget facebook melayang ini kita akan lebih mudah dan membuat pembaca bisa menutup close tampilan Like Box FP kita tersebut.
untuk itu bagi kalian yang mau coba silahkan bisa lihat beberapa caranya di sini.

Hal yang pertama adalah yang paling penting adalah baca doa dulu :D wkwkwkwk jika gak gak bakal berhasil (bercanda doang tapi kadang benar lho)

1. Login ke blogger.com

2. Pilih menu "Tata Letak"

3. Klik "Tambahkan Gadget" Terserah yang mana aja boleh, soalnya widget ini float (melayang).

4. Pilih "HTML/Javascript".

5. Masukkan kode dibawah ini.

 <!-- Script by: http://masterbama.blogspot.com/ -->
<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>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/gantipakenamafanspagekamu?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 -->
<a class='close' href='#'>&times;</a>
<p style=" float:right; margin-right:35px; font-size:10px;" >Powered By <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://putraagung01.blogspot.com/">Facebook</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="

http://putraagung01.blogspot.com/2015/02/cara-mudah-membuat-like-box-facebok.html

">Get This Widget</a></p>
</div>
<!-- Script by: http://putraagung01.blogspot.com/ -->

6. Ganti yang berwarna Merah dengan URL Fanspage Facebook kalian.

7. Klik "Simpan

Ini nih hasilnya seperti ini di tampilan saya :D maaf baru sedikit Likers saya jadi mohon bantu like juga ya gan :)

Bagi yang belum mengerti bisa tanyakan kepada saya di komentar di bawah ya :) semoga sukses...

• Tweet
• Share
• Share
• Share
• Share

About Penulis

Terima kasih atas kunjungannya, jangan lupa baca juga beberapa artikel di bawah ini dan semoga bermanfaat untuk sobat.

Related Post