Cara membuat pop up ringan untuk like facebook dan twitter ~ Westside Zone

Cara membuat Pop up ringan untuk like Facebook dan twitter
Disini saya mencoba untuk menjelaskan cara Cara membuat Pop up ringan untuk like Facebook dan twitter,

Kelebihan script yang ini adalah, facebook pop up tidak akan menggunakan frame, dan juga padding, yang mungkin bikin lebih lambat saat buka blog Anda, dengan tidak adanya frame script ini lebih ringan bekerja di blog Anda...

langsung aja saya coba untuk menjelaskan caranya:

1. Klik menu Page di Dashboard Blog
2. Klik Tata letak > klik tombol tambah gadget
3. Klik HTML/Javascript > Copy kode di bawah ini > lalu paste
5. SAVE

<style type='text/css'>
/* Message Box */
#box-message {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#fff;
font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #333;
-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;
}
#box-message a.close {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #333;
-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:22px;
-moz-border-radius:22px;
border-radius:22px;
cursor:pointer;
}
#twitterx {
background: #EEF9FD;
padding: 10px;
text-align:center;
border: 1px solid #C7DBE2;
border-top: 0;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top Value When Page Loaded Completed
$('#box-message').animate({top:"50px"}, 1000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='box-message'>

<center><a class="murub">Di like ya Sobat</a></center>
<center>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like-box href="https://www.facebook.com/westsidezone" width="250" show_faces="true" border_color="" stream="false" header="true">
</fb:like-box></center>

<br/>
<div class="twitter">
 <a class="twitter-follow-button" data-lang="id" data-show-count="true" href="https://twitter.com/westsidezoneID">Ikuti @westsidezoneID</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> </div>
<a class='close' href='#'>×</a>
</div>

keterangan kode berwarna Merah jangan lupa ganti dengan link facebook ataupun twitter kalian dan kode berwar na Biru isi caption apa yang kalian inginkan

sekian artikel ini saya buat....semoga bermanfaat....Good Luck

Cara membuat pop up ringan untuk like facebook dan twitter

Related Post