Widget Facebook Popup Like Box Update Terbaru

Widget Facebook Popup Like Box adalah widget yang akan sangat membantu kita untuk mendapatkan Like dari Pengunjung untuk FanPage kita di Facebook. Karena widget ini akan muncul di tengah - tengah Blog dan disertai dengan efek Fokus hanya pada widget ini (Popup) ketika pengunjung membuka Blog kita, sehingga lebih memudahkan dan mendorong pengunjung untuk Like FanPage Blog kita.

Apakah Widget Facebook Popup Like Box akan mengganggu pengunjung?

Tentunya tidak, karena widget ini hanya akan muncul sekali saja yaitu ketika pengunjung pertama kali mengunjungi Blog kita. Jadi, widget ini tidak akan terus muncul setiap pengunjung sehingga dapat mengganggu kenyamanan pengunjung. Tetapi widget ini bisa dirubah settingannya jika Temen - temen blogger tetap ingin widget ini terus - menerus muncul di setiap memuat halaman.
Baca Juga : Widget Share Jejaring Sosial Melayang di Blog

Bagaimana cara memasang Widget Facebook Popup Like Box?

Langkah Pertama, Memasang Widget Facebook Popup Like Box ke Blog.

1. Login ke Blogger.
2. Langsung saja menuju ke Dashboard >> Tata Letak.
3. Klik Link / Tombol "Tambahkan Gadget".
4. Pilih widget HTML/Javascript.
5. Copy semua Kode di Bawah ini  :
   
   <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
   <style>
   #fanback {
   display:none;
   background:rgba(0,0,0,0.8);
   width:100%;
   height:100%;
   position:fixed;
   top:0;
   left:0;
   z-index:99999;
   }
   #fan-exit {
   width:100%;
   height:100%;
   }
   #fanbox {
   background:white;
   width:420px;
   height:270px;
   position:absolute;
   top:58%;
   left:63%;
   margin:-220px 0 0 -375px;
   -webkit-box-shadow: inset 0 0 50px 0 #939393;
   -moz-box-shadow: inset 0 0 50px 0 #939393;
   box-shadow: inset 0 0 50px 0 #939393;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   margin: -220px 0 0 -375px;
   }
   #fanclose {
   float:right;
   cursor:pointer;
   background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS4mKGvKzfxKIaxf1PjHdfR0hlpVDv4kJVan_I7ddwi3r-5hIo9_rjyfXlMKac6J72349l-xArcG87zlcorRP2Ecdv3bOgOdprlFi4TAQZ_1GTT5J8b625gPAMXBZcHGWFGrtgUjDXEUxG/s1600/fanclose.png) repeat;
   height:15px;
   padding:20px;
   position:relative;
   padding-right:40px;
   margin-top:-20px;
   margin-right:-22px;
   }
   .remove-borda {
   height:1px;
   width:366px;
   margin:0 auto;
   background:#F3F3F3;
   margin-top:16px;
   position:relative;
   margin-left:20px;
   }
   #linkit a.visited,#linkit a,#linkit a:hover {
   color:#80808B;
   font-size:10px;
   margin: 0 auto 5px auto;
   float:center;
   }
   </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_user_login') != 'yes'){
   $('#fanback').delay(1000).fadeIn('medium');
   $('#fanclose, #fan-exit').click(function(){
   $('#fanback').stop().fadeOut('medium');
   });
   }
   
   });
   </script>
   
   <div id='fanback'>
   <div id='fan-exit'>
   </div>
   <div id='fanbox'>
   <div id='fanclose'>
   </div>
   <div class='remove-borda'>
   </div>
   <iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?
   
   href=https://www.facebook.com/310038429171571&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'
   
   style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'></iframe><center>
   <span id="linkit"><a href="http://zonnacyber.blogspot.com/2015/02/widget-facebook-popup-like-box-update.html" target="_blank">Widget Facebook </a><a href="http://zonnacyber.blogspot.com/">ZONNACYBER</a></span></center>
   </div>
   </div>
6. Paste di Widget HTML / JavaScript. Jangan dulu Di Simpan Karena Masih Ada Langkah Kedua...

Langkah Kedua, Merubah beberapa Kode.

1. Ganti https://www.facebook.com/310038429171571 dengan alamat FanPage kamu.
2. .delay(30000) Ganti Angka 30000 untuk merubah delay widgetnya (delay = detik kapan munculnya widget setelah halaman selesai dimuat). 1 detik = 1000 jadi, 30000 = 30 detik.
3. Untuk merubah Widget agar tidak hanya Muncul Sekali tetapi akan muncul di setiap saat Halaman di Muat. Cari dan Hapus Kode ini :
   

   $.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });

4. Simpan. dan Selesai.

Baca Juga : Cara Melihat PageRank Blog / Website + Widget PageRank Checker Keren
Perhatian : Widget ini hanya akan muncul sekali, jika Temen - temen blogger ingin melihatnya lagi untuk melihat apakah widget ini sudah bekerja dengan baik di Blog Temen - temen Blogger, Bersihkan Cookie Browser terlebih dahulu, dan Reload Halaman Blognya. Maka widget tersebut baru bisa muncul lagi.