Info Baru
Hosting Unlimited Indonesia

Cara Buat dan Pasang FanPage Facebook Melayang di WebBlog

jogjamitsubishi jogja kredit murah mitsubishi all new pajero sport wilayah jogja jateng delaer resmi mitsubishi jogja


Cara Membuat FanPage Facebook dan Follower Twitter Melayang di WebBlog
Membuat FanPage Facebook Melayang di WebBlog. Pernahkah kalian melihat splash Fanpage facebook yang ada tombol Like!/Suka melayang di halaman blog/website? Pastinya pernah kan, di webblog blankON-ku juga ada Splash Fanpage Facebook melayang + aada tombol follower Twitter lho..

Pasti dibayang kalian buatnya gimana ya?? Nah kali ini blankOn-ku akan memberikan tutorial cara membuat Kotak widget Splash FanPage facebook + tombol twitternya melayang di webblog.

Langkah-langkahnya :
1. Buka Dasbor Blog lalu pilih Tata Letak (1)

Tampilan Tata Lertak Dashboard pada Blogger


2. Klik Tambah Widget (2) lalu pilih HTML/Java Script
Pilih HTML/Jaava Script untuk menambah widget Blog


3. Pastekan Kode Script Dibawah ini di kotak HTML/Java Script
<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'>
<!-- HTML Start -->
<center><a class="murub">Jangan lupa Like! FanPage blankON-ku<br/>untuk mendapatkan update info dari kami<br/></a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/blankONku?ref=hl&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false&amp;appId=371524026202784" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</center>
<!-- HTML End -->
<br/>
<div class="twitter">
<!-- Twitter --> <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=blankonku&amp;show_count=&amp; show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe> </div>
<a class='close' href='#'>&times;</a>
</div>

Silahkan Ganti Tulisan :
  • Warna Merah : Tulisan atau Pesan Widget
  • Warna Biru : URL Fanspage kalian
  • Warna Ungu : Username Twitternya ,( contoh @blankonku maka tulis jadi blankonku)
 4. Save/Simpan

Nah bila benar tampilannya akan seperti milik blankON-ku ini, bisa dilihat pada gambar dibawah ini

Tampilan Widget FanPage Facebook Melayang di WebBlog


Oke mudahkan cara Membuat FanPage Facebook Melayang di WebBlog ini, semoga tutorial ini bisa memperkaya ide berkreasi kalian dalam mengembangkan blog/website.
Trims kunjungannya....




10 Postingan Terbaru :

0 Response to "Cara Buat dan Pasang FanPage Facebook Melayang di WebBlog"