MEMBUAT LIKE BOX DILENGKAPI TOMBOL Follow TWITTER MELAYANG DI BLOG

Goglees - Selamat datang kawan, setelah sebelumnya artikel tutor blog tentang Cara membuat widget Sosial Media Mirip Dengan Tampilan Windows 8 di blog kali ini akan penulis lanjutkan dengan tutor yang berjudul MEMBUAT LIKE BOX DILENGKAPI TOMBOL Follow TWITTER MELAYANG DI BLOG. Buat para teman blogger mungkin sudah tidak asing lagi dengan apa itu Like Box yang merupakan widget untuk mencari likers halaman yang kita miliki.

Dengan menggunakan like box melayang diyakini akan membuahkan hasil pada jumlah likers dalam halaman kita, karena disaat ada pengunjung ke blog anda maka secara otomatis pengunjung tersebut akan tertarik untuk me-like halaman facebook anda. Namun harus anda sadari bahwa tidak hanya like box dari facebook yang bisa dibuat melayang, akan tetapi tombol follow twitter juga bisa anda buat agar melayang berdampingan dengan like box facebook.

Untuk lebih jelasnya bisa lihat pada gambar di bawah ini.

Diatas sudah terlihat jelas bahwa terdapat tombol like box dan tombol follow twitter yang melayang berbarengan dalam satu widget. Jika teman berminat bisa coba dan ikuti langkah dibawah ini.

MEMBUAT LIKE BOX DILENGKAPI TOMBOL Follow TWITTER MELAYANG

Login dulu ke akun Blogger Anda.

Buka Tata Letak. Klik Tambah Gadget.

Kemudian, Pilih HTML/Java Script.

Lalu Masukin kode Java Script kedalam kotak yang telah di sediakan.

Terakhir Save.

Kode Java Script like box dan follow twitter melayang

<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">Jadilah yang Pertama dan Terakhir</a></center>
<center> Kode Halaman Facebook Anda</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=fajar_berkata&amp;show_count=&amp; show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe> </div>
<a class='close' href='#'>&times;</a>
<center><b><a href='http://goglees.blogspot.com/2014/03/likebox-followtwitter-melayang.html'>Ambil Widget Ini</a></b></center>
</div>

Keterangan:

Warna hijau ganti sesuai dengan kata-kata yang anda inginkan.

Warna Kuning ganti dengan kode iframe halaman facebook anda, untuk mendapatkan silahkan klik disini.

Warna Merah ganti dengan akun twitter anda.

Mungkin itu dulu pembahasan mengenai MEMBUAT LIKE BOX DILENGKAPI TOMBOL Follow TWITTER MELAYANG DI BLOG. Semoga bermanfaat dan terimakasih atas waktunya.