Pasang Iklan Anda Disini
Cara Membuat Widget Video Melayang Di Blog | Blog-Alfanetral
Lastest Movies :
Home » » Cara Membuat Widget Video Melayang Di Blog

Cara Membuat Widget Video Melayang Di Blog

Posting By blog-alfanetral | Sabtu, Oktober 19, 2013

Anda bingung tentang cara membuat widget video melayang blog? sekarang Saya akan memberitahu tentang bagaimana membuat video melayang blog, caranya mudah kok, tidak ada 5 menit juga bakal jadi video melayang blog. Tidak usah basa basi lagi sekarang Saya akan langsung ke TKP saja.




Jangan Lupa Juga Ya Follow Twitternya (^_^) @PuTra_HaLiem



Ini dia Membuat Widget Video Melayang Di Blog :

1. Login Ke Blogger
2. Dashbord > Tata letak > Gadget
3. Pilih saja  HTML Java Script

Sebelum Lanjut Selahkan Copy Code Script Di Bawah Ini!

-----------------------------------------------------------
 
 <style type='text/css'>
/* Message Box */
#box-message {
position:fixed !important;
position:absolute;
top:-1000px;
left:40%;
margin:0px 0px 0px -182px;
width:620px;
height:515;
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'>
<!-- HTML Start -->
<center><font color="red"><font size=4><blink>Jangan Lupa Di Follow Twitternya yaa (^_^)</blink></font></font></center>
<center>
<iframe width="560" height="400" src="//www.youtube.com/embed/tU_sdnGoMmo" frameborder="0" allowfullscreen></iframe>
</center>
<!-- HTML End -->
<br/>
<div class="twitter">
<!-- Twitter --> <center><iframe title="" style="width: 250px; height: 20px;" class="twitterx-follow-button" src="http://platform.twitter.com/widgets/follow_button.html#_=1319978796351&amp; align=&amp;button=blue&amp;id=twitter_tweet_button_0&amp; lang=ID&amp;link_color=&amp;screen_name=PuTra_HaLiem&amp;show_count=&amp; show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe></center> </div>
<a class='close' href='#'>&times;</a>
</div> 

Keterangan : 
Warna Merah Dan Hijau Adalah Ukuran Lebar Panjang Kotak Videonya
Warna Biru Adalah Code Embed Dari youtube
Dan Warna Merah Mudah Adalah ID Atau Username Twitter Anda!

Nah itulah Bagaimana Cara Membuat Widget Video Melayang Di Bloggampang kan teman, Sekian dulu dari saya semoga bermanfaat dan membantu anda sekalian.



DEMO   <---- Klik (^_^)
Suka Artikel Ini? Bagikan :

0 komentar:

PERHATIAN.!

Berikan Komentar Anda Tentang Artikel Di Atas!

 
█║▌│█│║▌║││█║▌│║▌║█║║▌
Copyright © 2016. Blog-Alfanetral - All Rights Reserved