Riifadya Blog

Blog Seputar Blogger Berbagi Template Blogger, Widget Blogger dan Tips Blogger dari Berbagai Sumber

Membuat Pop Up Like Facebook Keren di Blogger

Kali ini Saya akan berbagi tentang Cara Membuat Pop Up Like Facebook Keren di Blogger. Tutorial dari widget yang satu ini memang sudah banyak yang berbagi di blog lainnya, namun disini Saya akan coba memberikan tampilan yang lebih sederhana.

Membuat Pop Up Like Facebook Keren di Blogger

Dalam rangka meningkatkan pengunjung ke halaman Facebook, sobat perlu mempromosikan halaman Facebook untuk mendapatkan lebih banyak like dari pengguna yang mengunjungi blog sobat. Dan tidak diragukan lagi, dengan menambahkan pop up like box facebook ini di blogger adalah salah satu cara terbaik untuk meningkatkan penggemar dari halaman facebook sobat.

Silakan ikuti langkah sederhana berikut ini :
Disini sobat hanya perlu menambahkan kode di bawah ini pada widget blogger.

Buka blogger > Tata letak > Klik tambahkan gadget kemudian klik HTML/JavaScript > Salin dan terapkan semua kode di bawah ini didalamnya



<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/zulfadly.rizal07&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>

Setelah ditambahkan, klik Simpan.

Setelan :
Ganti url https://www.facebook.com/zulfadly.rizal07 dengan url halaman fan page facebook sobat

Sumber : Arlina Design
1 Komentar untuk "Membuat Pop Up Like Facebook Keren di Blogger"

Dilarang Spam
Berkomentar Sesuai Konten

 
Copyright © 2014 Riifadya Blog - All Rights Reserved
Template By. Catatan Info