Menulis

Cara Membuat Popup Facebook Fanspage Like Box di Blog

Posted by Romel Tea ● Follow @romeltea ● Like Romeltea Media on Facebook

Popup Facebook Fanspage Like Box
SALAH satu cara meningkatkan "likers" Fans Page Facebook adalah dengan membuat, memasang, atau menampilkan Popup Facebok Fanspage Like Box di situs web atau blog.

Popup ini akan sedikit mengganggu kenyamanan pengunjung, apalagi jika muncul terus tiap halaman. Biar tidak terlalu mengganggu, munculkan Popup Fanspage ini hanya sekali, atau di satu halaman yang dibuka, jangan tiap halaman.

Nah, kode berikut ini hanya memunculkan popup like box itu sekali saja, saat pertama kali pengunjung membuka halaman blog Anda. So, gak terlalu mengganggu 'kan?

Cara Membuat Popup Facebook Fanspage Like Box di Blog
1. Buat dulu Fans Page di Facebook2. Dapatkan URL atau username
3. Layout > Add a Gadget > HTML/Javascript
4. COPY & PASTE kode berikut ini di kolom "Content"
 
<style>#fbox-background {display: none;background: rgba(0,0,0,0.8);width: 100%;height: 100%;position: fixed;top: 0;left: 0;z-index: 99999;}
#fbox-close {width: 100%;height: 100%;}
#fbox-display {background: #eaeaea;border: 5px solid #828282;width: 340px;height: 230px;position: absolute;top: 32%;left: 37%;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
#fbox-button {float: right;cursor: pointer;position: absolute;right: 0px;top: 0px;}
#fbox-button:before {content: "CLOSE";padding: 5px 8px;background: #828282;color: #eaeaea;font-weight: bold;font-size: 10px;font-family: Tahoma;}
#fbox-link,#fbox-link a.visited,#fbox-link a,#fbox-link 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) {
// key and at least value given, set 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(''));
}
// key and possibly options given, get 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'){
$('#fbox-background').delay(5000).fadeIn('medium');
$('#fbox-button, #fbox-close').click(function(){
$('#fbox-background').stop().fadeOut('medium');
});
}
});</script>
<div id='fbox-background'>
<div id='fbox-close'>
</div>
<div id='fbox-display'>
<div id='fbox-button'>
</div>
<div class="fb-like-box" data-href="https://www.facebook.com/romelteamedia" data-width="300" data-height="300" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="false" data-show-border="false"></div>
</div>
</div>

5. Widgetnya 'gak usah dikasih judul apa-apa. Judul biarkan kosong!
6. Ganti url Fanspage-nya dengan link page Facebook Anda.

7. Pastikan di template Anda ada kode seperti ini:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>

Jika belum ada, tambahkan kode itu di atas kode </head>

8. Save!
Kini, jika lancar gak ada kendala, misalnya dibekukan Kemenpora kaya PSSI, maka Popup Facebook Fanspage Like Box sudah muncul di halaman blog Anda.

Untuk blog CMS Wordpress, Anda bisa install WP Plugin Facebook Page. (http://www.romelteamedia.com).*

Sumber

Author:

I am a Blogger, Media Practisioner, and Practical Communication Trainer. I share my own knowledges, experiences, and skills about practical communication - writing, speaking, blogging - and my hobbies and concerns. Visit my official website Romeltea.

Previous
« Prev Post
9 Komentar untuk "Cara Membuat Popup Facebook Fanspage Like Box di Blog"

clear browsing data, atau buka dengan browser lain,
kalo sudah pernah kebuka sekali, takkan muncul lagi

skali berapa kali munculnya om admin

Gan kalo muncul setiap loading page gimana gan,, ada yang di ubah??

sekali saja, saat pertama kali blog dibuka, jadi tidak mengganggu user

muncul setiap kali loading sangat mengganggu pembaca, gunakan kode di atas biar user nyaman membuka blog tanpa gangguan pop up like box

Wah gagal di blog ane om XD

You comment, I'll visit back your blog. If you have one. Komentar SPAM dan LINK AKTIF tidak akan muncul.