Tutorial Membuat Pesan Pembuka Pop Up Spesial Ramadhan

Banyak yang menghiasi blog mereka dengan widget-widget ramadhan seperti banner,marquee,dan lain lain.Tetapi saya kali ini akan membahas tentang widget Pesan Pembuka Pop Up ini.Widget ini dilengkapi dengan tombol Follow Fan Page Facebook DanTombol Follow Twitter,Serta Pesan Pembuka Ini Sangat Simple.Simak Tutorialnya Berikut Ini :

1. Masuk ke Blogger > Tata Letak > Tambah Gadget

2. Lalu pilih HTML/Javascript

3. Masukkan Code widget dibawah ini kedalamn HTML/Javascript

<style type="text/css">
#aganpopupdiv{display:block;}}
* html #aganpopupdiv {position:absolute;}
#aganpopupdiv {z-index: 999999;display:block; top:0px; left:0px; width:100%; height:100%; position:fixed; background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6I0bhDaXqIKrKg0Dma6Nm77GSh8AkqONkExsdTtSKTFKhSyWIPOQMlIIQPplU4YAWYA98x7m0FwX8Jx3ayf0KZJT-CEzme036nX8a0YyxPPchlSh37YZ_esWSLlrPiJ9NMh8ALZS6XQ/s128/exeideasopacity0.5.png');margin:0; overflow-y:auto;}
#aganpopup {background-color: #fff; overflow:none;}
.aganpopup {width:500px; height:375px; position:fixed; top:50%; left:50%; margin-top:-200px; margin-left:-250px;
background:url(https://lh5.googleusercontent.com/-7m6JoD09p7I/U6mAm6ZwkOI/AAAAAAAAFs4/D5Gk8nhOkdE/h1600/ramadhan+2014.jpg)no-repeat;border:2px solid #fff;}
</style>
<div id="aganpopupdiv">
<div id="aganpopup" class="aganpopup">
<center style="background:#fff;color:#000;cursor:pointer;float:left;margin-left:-2px;margin-top:-29px;padding:4px;font-family:Arial;font-weight:bold;" onmouseup="document.getElementById('aganpopupdiv').style.display='none'">
Tutup X
</center>
<div style='margin:354px 0px 5px 10px;'>
<iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2FTfvnBlogspot&amp;width&amp;layout=button&amp;action=like&amp;show_faces=false&amp;share=false&amp;height=35&amp;appId=288329154611945" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:35px;width:60px;" allowtransparency="true"></iframe></div>
<div style='margin:-45px 5px 5px 63px;'>
<!-- Twitter follow button start -->
<a href="http://twitter.com/alfryan_" class="twitter-follow-button"data-show-screen-name="false">Follow @alfryan_</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<!-- Twitter follow button end -->
</div>
<div style='margin:-30px 5px 5px 63px;float:right'>
<a href='http://t-fvn.blogspot.com/2014/07/tutorial-membuat-pesan-pembuka-pop-up.html' target='blank'>Get This Widget</a>
</div>
</div>
</div>

Silahkan ganti T-fvnBlogspot dengan Fan Page FB Sobat,dan ganti alfryan_ dengan alamat URL twitter sobat, dan jika ingin mengganti gambarnya ganti https://lh5.googleusercontent.com/-7m6JoD09p7I/U6mAm6ZwkOI/AAAAAAAAFs4/D5Gk8nhOkdE/h1600/ramadhan+2014.jpg dengan link gambar yang ingin dipasang

4. Langkah terakhir Klik Simpan

Pesan Pembuka Pop Up ini dijamin tidak akan memperlambat loading blog sobat.

Semoga Bermanfaat ...

Script Source

Support by :

URLCastle