Pasang Iklan Disini

Jumat, 27 Desember 2013

Cara Membuat Kotak Like Fanspage Facebook Melayang di Blogger

Assalamualaikum wr.wb
Dulu pernah kita bahas juga hal yang sama dengan yang sekarang, yaitu mengenai Cara Memasang Kotak Like Halaman Facebook Pada Blogger. Sekarang kita akan sama juga membahas hal tersebut, namun untuk yang akan kita bahas sekarang ini agak berbeda sedikit dan lebih efektif, yaitu dengan membuatnya melayang di blog kita agar lebih mudah mendapatkan like nya.
Contoh dari hasilnya seperti gambar dibawah ini.



Untuk cara pemasangannya cukup mudah, tinggal ikuti saja langkah-langkah berikut ini:
  • Pertama buka Blogger kalian.
  • Lalu klik Tata Letak.
  • Klik Add Gadget.
  • Setelah itu klik HTML/JavaScript.
  • Lalu masukkan kode dibawah ini.

<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">Jika Bermanfaat Silahkan Dilike ya!!</a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/TKJ-Komunitas-Indonesia/297087627033538?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=tkj_indo&amp;show_count=&amp; show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe> </div>
<a class='close' href='#'>&times;</a>
</div>






*Ganti tulisan yang berwarna sesuai ketentuan.
-Tulisan warna merah bisa diganti dengan kata-kata yang diinginkan.
-Tulisan warna biru bisa diganti dengan link fanspage kalian.
-Tulisan warna ungu bisa diganti dengan ID twitter kalian.

  • Setelah itu klik Simpan.
  • Lalu lihat hasilnya.
  • Semoga berhasil!




Mungkin itu saja yang dapat saya sampaikan.
Semoga bisa bermanfaat.
Wassalamualaikum wr.wb

Ketikkan email kalian dibawah dan klik Berlangganan untuk dapat berlangganan artikel kami:

Delivered by FeedBurner

Please Give Us Your 1 Minute In Sharing This Post!
SOCIALIZE IT →
FOLLOW US →
SHARE IT →

 
notifikasi
close