Blogger Facebook Tutorial

Popups FB Fanpage Like yang Mesra Pembaca

Bismillah,

fb like mesra pembaca
Hari ni, atas permintaan sahabat di facebook, saya buatkan tutorial khas di muatkan di sini. Kalau nak jelaskan berkenaan kod HTML, ia lebih jelas untuk di terangkan di sini berbanding di ruangan mesej facebook. Sepatutnya hari ini saya tidak menulis di sini kerana saya sudah pun menyediakan entri di blog lama saya di www.h2jbiz.blogspot.com, tetapi di sana jugalah saya test fb fanpage like popups yang saya sifatkan lebih mesra pembaca berbanding popup yang lain sebab…
  • Tiada paksaan bagi masa menunggu lama..
  • Tiada paksaan untuk ‘Like’ (huhu..)
  • Tiada paksaan untuk tutup popups sebab ia tidaklah mengacau ruang.
  • Punyai butang ‘Close’
  • Bentuk yang simple tetapi menarik
  • Akan mengikut skrol (cara memujuk yang halus untuk ‘Like’)
Anda boleh Copy and Paste kod atau skrip di bawah…

<style type=’text/css’>
#bloggerspiceFBpop {
position:fixed !important;
position:absolute;
top:35%;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#FEFEFE;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;
}
#bloggerspiceFBpop a.bsclose {
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:#000000;
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:25px;
cursor:pointer;
}
</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
$(‘#bloggerspiceFBpop’).animate({top:”100px”}, 1000);
// Widget by www.bloggerspice.com
$(‘a.bsclose’).click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id=’bloggerspiceFBpop’>
<!– Widget by www.bloggerspice.com Start –>
<center>
<b><a class=”BloggerSpice”>Jom bersama-sama kami. Kliklah “Like” 🙂</a></b></center>
<center>
<iframe src=”//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fhairizalblogperniagaan&width=292&height=258&show_faces=true&colorscheme=light&stream=false&show_border=true&header=false” scrolling=”no” frameborder=”0″ style=”border:none; overflow:hidden; width:292px; height:258px;” allowtransparency=”true”></iframe></center>
<!– Widget by www.bloggerspice.com End –>
<a class=’bsclose’ href=’#’>×</a>

</div>

Bagi pengguna blogger blog atau blogspot boleh ke…
 
Layout > Di bahagian sidebar, klik Add a Gadget > dan klik Add HTML/Javascript kemudian paste atau masukkan kod di atas dan Save.
Anda boleh ubah teks berwarna biru dengan teks anda dan tukar tajuk fanpage anda dari teks yang berwarna merah yang saya berikan tu.
Ok, semoga bermanfaat untuk semua…
Kredit untuk bloggerspice untuk skrip ni.
Wassalam…

UPDATE : 27/11/2013 – Sudah tak letak wijet ini lagi dan kembali seperti sebelum ini. 

Leave a Reply

Your email address will not be published. Required fields are marked *