Baiklah sobat berikut ini adalah widget likebox Facebook efek popup yang tampilannya simple dan keren menurut kami. Kamu bisa mendapatkan banyak pengunjung melalui halaman facebook kamu, jadi biar fanspage facebook kamu terkenal kamu harus mendapatkan like yang banyak di halaman facebook ini.

Kamu bisa mempromosikan halaman facebook melalui web/blog dari pengunjung yang mengakses halaman di web/blog kamu, salah satu cara adalah dengan memasang widget like box fanspage efek popup seperti ini. Walaupun ini kelihatan seperti memaksa pengunjung, tapi ini adalah cara yang tepat untuk mempercepat banyaknya like di Facebook Page ini.

Kenapa harus dapat banyak like di halaman fan page facebook? alasannya simple saja, semakin banyak jumlah like di fanspage facebook nantinya ketika kamu membagikan atau memposting artikel kamu dari blog ke halaman fanspage maka jumlah orang yang melihat artikel akan semakin banyak pula.

Cara Membuat Like Box Fanspage Facebook efek popup melayang Di Blogger
Cara Membuat Popup Like Box Facebook Page


Berbicara mengenai widget Facebook Popup effect sebelumnya juga seocips.com sudah pernah membagikan widget like box efek melayang dan cara membuat like box fanspage popup dengan waktu di Blog. Ok berikut adalah cara membuatnya...

Membuat Popup Like Box Fanspage Facebook

Sebelumnya kamu harus memiliki halaman Fanspage Facebook ( Baca : cara membuat halaman fanspage facebook ) kemudian login ke blog kamu dan masukan kode di bawah ini pada widget HTML Blog. Caranya: Blogger > Tata Letak > HTML/Javascript dan masukan kode dibawah ini.
<style scoped='' type='text/css'>
#fb-fanbox {display:none;background:rgba(0,0,0,0.9);width:100%;height:100%;position:fixed;top:0;left:0;z-index:99999;-webkit-transform:translateZ(0);}
#fb-boxclose {width:100%;height:100%;-webkit-transform:translateZ(0);}
#fb-boxview {background:#fff;border:8px solid #03a9f4;width:340px;height:230px;position:absolute;top:33%;left:37%;border-radius:3px;}
#fb-closebox {float:right;cursor:pointer;position:absolute;right:-1px;top:-2px;z-index:2;}
#fb-closebox:before {content:"CLOSE";padding:5px 8px;background:#03a9f4;color:#fff;font-weight:normal;font-size:10px;font-family:inherit;}
#fb-boxlink,#fb-boxlink a.visited,#fb-boxlink a,#fb-boxlink a:hover {color:#aaaaaa;font-size:9px;text-decoration:none;text-align:center;padding:5px;}
</style>
<script type='text/javascript'>
//<![CDATA[
jQuery.cookie = function (key, value, options) {
// Pengaturan cookie
if (arguments.length > 1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);
if (value === null || value === undefined) {
options.expires = -1;
}
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}
value = String(value);
return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
// Dapatkan cookie
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_facebook_box') != 'yes'){
$('#fb-fanbox').delay(3000).fadeIn('fast');
$('#fb-closebox, #fb-boxclose').click(function(){
$('#fb-fanbox').stop().fadeOut('fast');
});
}
$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 });
});
</script>
<div id='fb-fanbox'>
<div id='fb-boxclose'>
</div>
<div id='fb-boxview'>
<div id='fb-closebox'>
</div>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?
href=https://www.facebook.com/seocips&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'
style='border:none;overflow:hidden;width:339px;height:200px;'></iframe>
</div>
</div>

Setting:

Jangan lupa ganti https://www.facebook.com/seocips dengan url / link fanspage facebook milik anda. Untuk mengatur jeda waktu meunculnya popup ini cari kode .delay(3000) dan atur nilainya. Jika ingin memunculkan popup facebook ini setiap kali halaman blog di buka silahkan hapus kode $.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 }); dan menonaktifkan cookie : false pada script dibawah ini jika script dibawah ini ada pada / terpasang pada template.
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'KODE-APLIKASI',
status : true, // check login status
cookie : false, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
Tambahkan juga script diatas jika likebox fanspage facebook tidak muncul.
6 Komentar untuk "Cara Membuat Popup Like Box Facebook Keren di Blog"

kalau kode keduanya belum terpasang pada blog, cara pasangnya bagaimana bro...?

Kamu bisa melatakannya di atas kode </body> , atau kamu juga bisa menggabungkannya dengan kode yang pertama, caranya tambahkan saja dibawah kode pertama.

+Brando Mewo

kalo di dalam website PC bagus bro cmn kalo sudah masuk ke smartphone jadinya aneh ga ditengah bro... caranya nengahin kalo dibuka lewat HP gimana? thanks infonya

Tammbahkan script (kode terakhir) kedalam template atau widget, jangan lupa kode aplikasi di isi dengan kode aplikasi facebook kamu. Kamu bisa dapatkan kode aplikasi di facebook developer.

gan script ini dah sesuai kalo dilihat di PC desktop atau Laptop dan ada ditengah tengah. Cuman kalo dibuka di HP smartphone kenapa tidak pas ditengah ya?? ada saran???