Cara Membuat Fan Page Melayang di Blog
Labels:
HTML/JavaScript,
Tips and Trik,
Top Post
Hello Sobat blogger, bicara tentang Kotak FanPage atau Like Box pastinya Sobat blogger sudah tidak asing lagi. Like Box berfungsi sebagai tempat Fans Blog Sobat di Facebook dan tempatnya ada di Blog Sobat. Contohnya seperti pada blog ini,,,
Nah, nggak kalah keren kan?
Sekarang tinggal cara membuatnya, bagi Sobat yang tertarik dan ingin membuat FanPage Kayak diatas itu, caranya gampang banget, sobat tinggal ikuti langkah-langkah berikut.
Cara Membuat Kotak FanPage Melayang Versi 2
1. Buka dulu akun blogger Sobat.
2. Masuk ke bagian Tata Letak.
3. Klik Tambahkan Gadget.
4. Pilih HTML/JavaScript.
5. Kemudian Copy dan Pastekan kode dibawah ini ke Halaman HTML gadget yang baru saja sobat tambahkan tadi.
COPY CODE
<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">Suka dengan artikel di blog ini? like FanPage dibawah ini untuk mendapatkan artikel terbaru via FACEBOOK</a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/syber.hacker.net&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>
<!-- HTML End -->
<br/>
<a class='close' href='#'>×</a> </div>
Subscribe to:
Post Comments (Atom)
0 comments:
Post a Comment