0 Cara Membuat Widget Pop Up Card Di Blogger

• Login ke Blogger.com

• Masuk ke Tab Template-> Klik Edit HTML, Cari Code ]]></b:skin> atau </style> 

• kalo sudah ketemu, masukan CSS di bawah ini tepat di atas kode yang tadi di cari

/*Widget Pop Up Card*/
#mstamvan {
    z-index: 1000;
    position: fixed !important;
    top: 100px;
    left: 50%;
    width: 700px;
    margin-left: -350px;
}
#belakang {
    left: 0px;
    background: #000 none repeat scroll 0% 0%;
    opacity: 0.6;
    position: fixed;
    z-index: -1;
    top: 0px;
    height: 100%;
    width: 100%;
}
.tulisan {
font-size: 20px;
background: #FFF none repeat scroll 0% 0%;
border-radius: 50%;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.14);
cursor: pointer;
display: inline-block;
padding: 2px 9px;
text-align: center;
font-family: arial,sans-serif;
position: absolute;
top: -15px;
right: -20px;
  collor:#344;
  return:false;
}
.isinya {
      border-radius: 3px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    width: 700px;
    height: 400px;
    border: 4px solid #FFF;
}

• Sekarang Masukan Javascript Dibawah Ini Tepat Diatas Kode </BODY>

<script type='text/javascript' >
$(document).ready(function() {
  $('#mstamvan').click(function() {
 $('#mstamvan').fadeOut('500');
  });
});
</script>

• Save Template. 
• Lanjut Ketahap Selanjutnya

• Masuk ke Tata Letak, Tambahkan Gadget, Terus cari HTML/Javascript.

• Contoh, Lihat gambar dibawah!!

• Setelah diklik / dibuka HTML/Javascriptnya, Masukan Script Widget Pop Up yang dibawah kedalamnya.

<div id='mstamvan'>
<div id='belakang'></div>
<div class='tulisan' onclick='this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode)'><a>&#215;</a></div>
<div class='isinya'><a href='http://fb.com/tejasukmana99' target='_blank'><img style="width: 700px; height: 400px;" alt='Mas Tamvan on Facebook!' src='LINK IMAGE'/></a>
  </div>
</div>
</div>

• Ok, sekarang tinggal save templatenya and DONE, Salam Tamvan

Silahkan Ganti Kata LINK IMAGE dengan link image buatan agan
Ganti Juga Link Fb ini sengan link kalian
http://fb.com/tejasukmana99

Komentar →