Widget Popup Fanspage versi Polos



Kali ini saya akan share Artikel tentang Widget, widget ini mungkin sering di jumpai para blogger saat berkunjung ke blog lain. Namun kali ini saya akan share Widget Popup Fanspage versi Polos yang mungkin masih jarang kalian temui. Kelebihannya widget ini tidak begitu berat dan  juga tidak disertai dengan timer

Langsung saja ke pembahasan

1. Login ke Blogger sobat
2. Klik panah kecil (Opsi Lainnya), kemuian pilih Tata Letak
3. Tambahkan Gadget, pilih HTML/Javascript
4. Masukkan Kode berikut

<!-- FB melayang tombol close --!>
<style type='text/css'>
#kotak-facebook {
position:fixed !important;
position:absolute; /* IE6 */
bottom:-1000px;
right:40%;
margin:0px 0px 0px -182px;
width:310px;
height:auto;
padding:16px;
-webkit-box-shadow: 0px 0px 7px #222;
-moz-box-shadow: 0px 0px 7px #222;
box-shadow: 0px 0px 7px #222; background-color:#FFFFFF; font:normal 1em Cambria,Georgia,Serif;
color:#111;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px;}
#kotak-facebook a.close {
position:absolute;
top:-10px;
right:-10px;
background:#333;
font:bold 16px Arial,Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#fff;
border:2px solid #fff;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
cursor:pointer;
}
</style>
<script type='text/javascript'>
$(window).bind("load", function() {
// animasikan nilai top saat halaman telah selesai dimuat
$('#kotak-facebook').animate({bottom:"50px"}, 1000);
// hilangkan kotak pesan saat tombol (x) di klik
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='kotak-facebook'>
<p style=" margin-right:10px; font-size:15px; color:#000000;">Like Fanspage Kami,<blink> CoretaNewbiee!!</blink> </p>
<!-- Mulai --!>

<div class="fb-like-box" data-href="https://www.facebook.com/CoretaNewbiee" data-width="292" data-show-faces="true" data-stream="false" data-show-border="true" data-header="true"></div>

<!-- Selesai --!><a class='close' href='#'>&times;</a>
<p style=" float:right; margin-right:35px; font-size:10px;" >
</p></div>

- Keterangan:
      Tulisan berwarna Merah ganti dengan terserah sesuai keinginan sobat
      Tulisan berwarna Oranye ganti dengan link Fanspage anda
   

- Simpan & Selesai





Sekian Pembelajaran tentang Widget
Semoga bermanfaat, Terima Kasih

Comments

Post a Comment

Peraturan Berkomentar Di Coretanewbiee

HARAP MEMBACA TERLEBIH DAHULU
SEBELUM BERKOMENTAR

|| Dilarang Spam ||
|| Dilarang Meninggalkan Link Aktif ||
|| Diharapkan berkomentar Sesuai Dengan Post ||
|| Berkomentar Yang Mengarah Ke Sisi Positif ||
|| Utamakan Baca Artikel sebelum berkomentar ||
|| Dilarang SARA , PORN, atau sebagainya ||
|| Diharapkan berkomentar menggunakan bahasa yang sopan ||

Komentar Yang Melanggar Akan Segera DiHapus

Tertanda "CoretaNewbiee" ✔

Popular posts from this blog

G vusion Responsive Blogger Template

Asiknya Iklan Beri Oreo tuk si vampir

Judul lagu iklan McDonalds 2016 berhadiah Mobil HRV