Rabu, 22 April 2015

Cara pasang fanspage facebook dengan pop up window

Wilujeng wayahkieu sobat,,,,

Sobat blogger pasti punya akun fans page Facebook (halaman facebook) kan,,,
Fitur ini banyak manfaatnya, fans page facebook banyak digunakan oleh pelaku bisnis sebagai salah satu sarana promosi produk, menjaring prospek, menjaring konsumen, komunikasi dengan konsumen, dll. Intinya fansfage facebook banyak digunakan untuk mengembangkan bisnis yang dijalankannya.

Bagi seorang blogger, fansfage juga sangat bermanfaat, bisa digunakan sebagai salah satu parameter / ukuran kepopuleran sebuah blog.

Lihatlah blog-blog yang populer, maka biasanya fanspage-nya pun banyak yang menyukai.

Dan terkadang, pengunjung melihat kepopuleran sebuah blog dengan melihat seberapa banyak yang menyukai fanspage yang dipasang di blog tersebut,,

Tapi memang itu tidak mutlak. Jumlah like fanspage bukanlah satu-satunya parameter untuk menilai kepopuleran sebuah blog, masih banyak yang lainnya yang bisa dijadikan parameter / ukuran. Bisa saja blognya emang sudah populer namun yang menyukai fanspagenya hanya sedikit, itu bisa dikarenakan fanspagenya baru dibuat, atau karena peletakan widget fanspage yang kurang strategis,,,

Nah,,, terkait PELETAKAN WIDGET FANSPAGE, ini sangat berpengaruh terhadap pertumbuhan faspage tersebut.

Agar semakin banyak yang meyukai maka widget tersebut harus di letakkan di tempat yang mudah di lihat pengunjung.

Umumnya widget fansfage di simpan di bagian sidebar, footer, di bawah artikel, melayang, atau berupa pop up window (apa ya bahasa sederhanaya pop up window ,,,, ????## )

Dari beberapa tempat meletakkan widget, saya lebih suka dengan pop up window. Pertumbuhannya lebih cepat. Cuma memang, ada beberapa yang menggunakan cara ini ternyata memberatkan loading halaman.

Cara pasang fans fage facebook dengan pop up window

Jika sobat baru pertama berkunjung ke blog ini, maka yang pertamakali muncul adalah widget fans page facebook, sementara di belakangnya ditampilkan halaman blog ini.

Jika sobat ingin tampilan fanspage facebook seperti di blog ini, dibawah saya kasih scripnya,,,,
Silahkan copy aja,,,


<!-- facebook like box starts -->
<!-- popup box stylings -->
<style type="text/css">
#fb-back { display: none; background: rgba(0,0,0,0.8); width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 99999;}
#fb-exit { width: 100%; height: 100%; }
.fb-box-inner { width:300px; position: relative; display:block; padding: 20px 0px 0px; margin:0 auto; text-align:center; }
#fb-close { cursor: pointer; position: absolute; top: 5px; right: 5px; font-size: 18px; font-weight:700; color: #000; z-index: 99999; display:inline-block; line-height: 18px; height:18px;width: 18px; }
#fb-close:hover { color:#06c; }
#fb-box { min-width: 340px; min-height: 360px; position: absolute; top: 50%; left: 50%; margin: -220px 0 0 -170px; -webkit-box-shadow: 0px 0px 16px #000; -moz-box-shadow: 0px 0px 16px #000; box-shadow: 0px 0px 16px #000; -webkit-border-radius: 8px;-moz-border-radius: 8px; border-radius: 8px;
background: #fff; /* pop up box bg color */
border-bottom: 40px solid #f0f0f0; /* pop up bottom border color/size */
}
.fb-box-inner h3 { line-height: 1; margin:0 auto; text-transform:none;letter-spacing:none;
font-size: 23px!important; /* header size */
color:#06c!important; /* header color */
}
.fb-box-inner p { line-height: 1; margin:0 auto 20px;text-transform:none;letter-spacing:none;
font-size: 13px!important; /* header size */
color:#333!important; /* text color */
}
a.fb-link { position:relative;margin: 0 auto; display: block; text-align:center; color: #333; /* link color */
bottom: -30px;
}
#fb-box h3,#fb-box p, a.fb-link { max-width:290px; padding:0; }
</style>

<!-- facebook plugin -->
<div id='fb-back'>
<div id="fb-exit"> </div>
<div id='fb-box'>
<div class="fb-box-inner">
<div id="fb-close">X</div>
<!-- edit your popup header text here -->
<h3>Suka dengan blog saya ?</h3>
<!-- edit your supporting text here -->
<p>Klik <b>SUKA</b></p>
<!-- edit your fb name below -->
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/ylaskarblogspotcom&width=290&height=275&colorscheme=light&show_faces=true&border_color=%23ffffff&stream=false&header=false'style='border: 0 none; overflow: hidden; width: 290px; height: 270px;text-align:center;margin:0 auto;'></iframe>
<!-- edit your supporting link here -->
<a class="fb-link" href="http://www.alasaya.com">Contact Us</a>
</div>
</div>
</div>
<!-- popup plug-in snippet -->
<script type='text/javascript'>
//<![CDATA[
//grab user's browser info and calculates/saves first visit
jQuery.cookie = function (key, value, options) { 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() : '', options.path ? '; path=' + options.path : '', options.domain ? '; domain=' + options.domain : '', options.secure ? '; secure' : ''].join('')); }
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; };
// the pop up actions
$(function ($) {
if ($.cookie('popup_fb') != 'yes') {
$('#fb-back').delay(400).fadeIn("slow"); // options slow or fast
$('#fb-close, #fb-exit').click(function () {
$('#fb-back').stop().fadeOut("slow"); // options slow or fast
});
}
//initiate popup function by setting up the cookie expiring time
$.cookie('popup_fb', 'yes', { path: '/', expires: 3 });
});
//]]>
</script>
<!-- facebook like box ends -->


KETERANGAN :
  • 'Suka dengan blog saya ?' adalah header text, sobat bisa menggantinya dengan kalimat sobat sendiri, atau biarkan saja.
  • 'ylasakarblogspotcom' ganti dengan ID halaman facebook sobat
  • 'http://www.alasaya.com' ganti dengan halaman kontak blog sobat.
  • expires : 3 .
    Angka 3 merupakan perintah agar widget ditampilkan 3 hari berikutnya pada browser yang sama.
    Jika hari ini sobat baru pertama kali berkunjung ke blog ini, maka sobat akan melihat widget tersebut, jika besok sobat buka blog ini lagi dengan browser yang sama maka widget ini tidak akan ditampilkan, kecuali sobat menghapus cookies pada browser. Dan jk 3 hari berikutnya sobat buka lagi blog ini, maka widget akan tampil lagi.
    Silahkan sobat atur mau berapa hari cookiesnya tersimpan.

Bagaimana,,, panjang ya kode - kodenya,,, :)

Biar lebih gampang, nih saya kasih filenya aja yang bisa sobat download melalui link di bawah ini :


Dimana tuh kode dimasukkannya ?

Untuk menempatkan kode-kode tersebut sobat cukup tambahkan di sidebar. Gampang aja kan,,, gak usah udat-edit template,,,

Saya jamin,, fanspage sobat akan cepat tumbuh,,, saya sudah rasakan sendiri dengan peletakan seperti ini pertumbuhannya lebih cepat dibanding di diletakkan di sidebar,,

Tips ini saya dapatkan dari blog berbahasa bule,,, tapi lupa saya apa nama blognya..

Ok,, semoga bermanfaat,,,

Dan jangan lupa,,, bagikan yaaa artikelnya ,,,,, :)

Share this:

Related Posts
Disqus Comments