Cara Membuat Kotak Popup Facebook Like Page di Blogspot

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Teknik promosi Blog ke sosial media adalah salah satu teknik SEO OFFPage yang ampuh, mengingat Sosial Media adalah situs yang tentunya lebih sering dikunjungi daripada blog pada umumnya, mungkin perhari ada jutaan orang di dunia mengaksesnya secara bersamaan. Oleh karena itu, kita harus bisa memanfaatkannya dengan baik. Dalam artikel ini, kita ambil contoh sosial media adalah Facebook, di mana mungkin ini adalah sosial media paling populer di dunia hingga tulisan ini ditulis. Langkah awal dalam promosi sosial media adalah membuat FansPage blog kita di Facebook dan jika ingin mengoptimalkan Fans Page tersebut kita bisa membuat Widget penunjang.
Logo Facebook
 
Salah satu widget penunjang yang bisa dipakai adalah kotak POP-UP Facebook Like Page. Di artikel ini akan dibahas cara memasang Widget Fans Page Pop Up Facebook untuk blogspot. Caranya adalah sebagai berikut : 

1. Buka Blogger.com ! Masuk ke Dashboard, lalu klik Template ! Kemudian pilih Edit HTML !
2. Cari kode </body> dengan menggunakan tombol CTRL ditekan bersamaan dengan tombol F ! Biasanya kode </body> terletak di bagian hampir paling bawah.
3. Salin dan tempel kode di bawah ini tepat di atas kode </body> !
<!-- FB FANS PAGE LIKE BOX -->
<style type='text/css'>
#haakblogFBpop {
position:fixed !important;
position:absolute;
top:-1000px;
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;
}
#haakblogFBpop a.haakblogclose {
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 src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(window).bind(&quot;load&quot;, function() {
// Animate Top
$(&#39;#haakblogFBpop&#39;).animate({top:&quot;150px&quot;}, 1000);
// Widget by www.haakblog.com
$(&#39;a.haakblogclose&#39;).click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='haakblogFBpop'>
<center>
<b>ini adalah contoh silakan diganti!<br/>
Ini adalah contoh untuk baris di bawahnya, silakan diganti!
</b></center>
<hr/>
<center>
<iframe allowtrans
parency='true' frameborder='0' scrolling='no' src='https://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/ID HALAMAN FACEBOOK&amp;width=300&amp;height=258&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;show_border=false&amp;header=false&amp;appId=196282097100252' style='border:none; overflow:hidden; width:300px; height:258px;'/>
</center>
<a class='haakblogclose' href='#'>&#215;</a>
<center style='float:right; margin-right:10px;'>
<span style='font-size:xx-small; color:#000; text-decoration:none;'/>
<a href='http://www.haakblog.com' rel='dofollow' target='_blank' title='blogger'><img alt='blogger' border='0' src='https://bitly.com/haakblog' style='position: fixed; bottom: 10%; right: 0%;'/></a><a href='https://www.facebook.com/pages/ID HALAMAN FACEBOOK' style='font-size:xx-small; color:#3B78CD; text-decoration:none;' target='_blank'>Bimagz</a></center>
</div>

<!-- FB FANS PAGE LIKE BOX -->
4. Ganti bagian yang diwarnai dengan warna biru dengan ID halaman Facebook Anda !
5. Ganti juga kata-kata berwarna hijau seperlunya !
6. Simpan Perubahan !

Jika Anda mengalami kegagalan, coba periksa kembali langkah-langkah yang Anda lakukan, bisa jadi Anda kurang teliti dalam mengedit kode-kode yang sudah diwarnai.
Back To Top