Cara membuat Pop Up Fanspage Fb Melayang

Oleh Byrdty

Senin, 11 Mei 2015

Bagikan :

Tweet

Cara membuat Pop Up Fanspage Facebook melayang di Blog

BCA Site.-Setelah sebelumnya saya memposting Cara membuat kotak Script/teks di dalam kotak,kali ini saya akan memberikan Cara membuat Pop up Fanspage Fb di Blog.Cara membuat pop up fanspage fb melayang di Blog sebenarnya mudah dan tujuan di buat nya yaitu agar pengunjung menyukai halaman/grup kita dan membuat blog kita lebih keren. 



Langsung saja ikuti cara nya di bawah ini

1. Masuk ke Blogger
2. Pilih situs blog mana yang akan diberi Pop up fanspage Fb
3. Pilih Tata Letak
4. Klik HTML/Javascript
5. Copy kode di bawah ini dan Paste di HTML/Javascript

Kode 
  

<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 situs BCA Site apabila suka ya.</a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/bcasiteblog?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 --!>

Catatan :

1. Ganti teks warna Hijau dengan tulisan yang akan tampil di Pop Up nya (Terserah kalian)
2. ganti teks warna merah dengan alamat halaman Fanspage Facebook kalian.

Cukup sekian,semoga bermanfaat.Apabila ada yang perlu ditanyakan,silahkan beri komentarnya di kolom komentar.

Tag : Tutorial Blogger