Your-BelajarBLOG: Cara Membuat Kotak Pop Up Facebook Like Widget

Pop Up Facebook Like ini adalah Pop Up yang muncul diasat pengunjung membuka blog anda. Dengan Pop Up ini Pengunjung tidak harus membuka Widget Like Facebook yang anda biasa buat. Pop up ini berguna untuk mendatangkan Like Facebook yang lumayan banyak dibandingkan dengan Widget Like Facebook biasa anda buat. Pop Up ini juga tidak mempersulit pengunjung melihat posting. Pup up ini dilengkapi dengan tombol close yang bisa di close agar tidak menghalangi Posting. Jika Pop up tidak di close
Pop Up dalam 20 detik akan menyembunyikan sendiri. Facebook ini juga bisa termasuk hiasan untuk menghiasi Like Facebook. Untuk itu saya akan menjelaskan cara untuk membuat Kotak Pop Up Like Facebook. Untuk Membuatnya silahkan ikuti cara berikut ini:

Silahkan Login Ke Blogger Anda.
Setelah itu, Klik Menu Template --> Klik Tombol Edit HTML untuk mengedit HTML anda.
Centang Expand Template Widget, Lalu, Cari Kode </body> dengan menekan CTRL+F atau dengan F3.
Setelah menemukan, Masukan Kode Berikut ini di atas kode </body>

.fbflush {
    cursor: pointer;
    font-size: 11px !important;
    color: #FFF !important;
    text-decoration: none !important;
    border: 0 !important;
}
#fblikebg {
    display: none;
    position: fixed;
    _position: absolute;
 /* hack for IE 6*/
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: #000000;
    z-index: 100;
}#fblikepop #closeable {
    float: right;
    margin: 7px 15px 0 0;
}#fblikepop h1 {
    background: #6D84B4 none repeat scroll 0 0;
    border-top: 1px solid #3B5998;
    border-left: 1px solid #3B5998;
    border-right: 1px solid #3B5998;
    color: #FFFFFF !important;
    font-size: 14px !important;
    font-weight: normal !important;
    padding: 5px !important;
    margin: 0 !important;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif !important;
}#fblikepop #actionHolder {
    height: 30px;
    overflow: hidden;
}#fblikepop #buttonArea {
    background: #F2F2F2;
    border-top: 1px solid #CCCCCC;
    padding: 10px;
    min-height: 50px;
}#fblikepop #buttonArea a {
    color: #999999 !important;
    text-decoration: none !important;
    border: 0 !important;
    font-size: 10px !important;
}#fblikepop #buttonArea a:hover {
    color: #333 !important;
    text-decoration: none !important;
    border: 0 !important;
}#fblikepop #popupMessage {
    font-size: 12px !important;
    font-weight: normal !important;
    line-height: 22px;
    padding: 8px;
    background: #fff !important;
}#fblikepop #counter-display {
    float: right;
    font-size: 11px !important;
    font-weight: normal !important;
    margin: 5px 0 0 0;
    text-align: right;
    line-height: 16px;
}</style>
<script src="http://www.google.com/jsapi"></script><script>google.load("jquery", "1");</script> 
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<script type="text/javascript">
//<![CDATA[
 kakinetworkdotcom01username="Your-Belajar Blog",
 kakinetworkdotcom01title="Join Us On Facebook!",
 kakinetworkdotcom01skin="04",
 kakinetworkdotcom01time="20",
 kakinetworkdotcom01wait="0",
 kakinetworkdotcom01lang="en"
//]]>
</script>
<script type="text/javascript" src="https://dl.dropbox.com/u/63968842/fbjqureywidget%28www.widgetgenerators.blogspot.com%29.js"></script>
<script type="text/javascript">
//<![CDATA[
 $(document).ready(function(){$().kakinetworkdotcom({ closeable: true });});
//]]>
</script>

Keterangan:
Ganti Tulisan Your-Belajar Blog dengan Nama Pengguna Facebook Anda.

Setelah itu, Klik Tombol Pratinjau untuk meninjau kesalahan, Jika Tidak ada kesalahan, Klik Tombol Simpan Template.

Selamat Mencoba,

Salam Sukses.

Your-BelajarBLOG

Your-BelajarBLOG

2/03/2013

Cara Membuat Kotak Pop Up Facebook Like Widget

No comments:

Post a Comment