Tutorial Cara Membuat Pop up Facebook Page di Blogger

Cara membuat halaman facebook muncul di Blog

Tutorial Cara Membuat Pop-up Fans Page di Blogger. Halo sobat sekalian, pada bahasan yang sangat singkat ini saya akan membagikan tutorial tentang bagaimana cara membuat Fans Page Facebook yang mungkin banyak diantara sobat-sobat yang membutuhkannya.

Facebook Fans Page atau Halaman Facebook sangat berguna untuk sebuah website atau blog. Terkhusus untuk blogger, dimana disana sobat bisa membagikan link/url artikel terbaru blog sobat, sehingga mendapatkan banyak traffic dari facebook.

Untuk mendongkrak agar halaman facebook kita memiliki banyak Like, kita punya cara alternatif yaitu membuat sebuah pup-up(munculan) seperti ini :

Dengan Pop up tersebut bisa saja blog yang sobat miliki mendapatkan banyak like untuk halaman facebook blog tersebut.

Nah untuk cara memasangnya sangatlah gampang, silahkan simak langkah-langkah dibawah ini.


Tutorial Cara Membuat Pop up Facebook Page di Blogger


  1. Login ke Blogger
  2. Pilih Layout/Tata Letak pada Menu sidebar kiri
  3. Tambahkan gadget > HTML/Javascript
  4. Copy kode berikut dan paste kedalamnya
    <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 ##6fcd6f;width:320px;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:#6fcd6f;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/masnubie&width=320&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'
    style='border:none;overflow:hidden;width:320px;height:200px;'></iframe>
    </div>
    </div>
    
  5. Silahkan ganti URL facebook Mas Nubie dengan URL facebook sobat
  6. Untuk mengubah warna tombol Close, silahkan ganti kode warna #6fcd6f dengan kode warna yang sobat sukai
  7. Klik Simpan dan lihat hasilnya

Nah, mungkin itulah sedikit Tutorial Cara Membuat Pop up Facebook Page di Blogger, semoga bermanfaat.

Disqus
Sistem Komentar