Cara Membuat Widget Fanspage Facebook Dan Follow Twitter Melayang



halo sahabat semua, kali ini sahabat kelor akan memberikan ilmu lagi ni ke teman teman blogger tentang cara membuat widget fanspage facebook dan follow Twitter melayang, pasti sering kan melihat hal yang seperti ini, bisa lihat gambar yang di bawah sebagai contoh, tapi gambarnya nemu di google bukan punya saya, gak tau punya siapa, tapi saya pernah melakukan ini pada blog saya yang satunya, tapi sekarang sudah tidak saya gunakan lagi, jadi terpaksa pake gambar yang di bawah
Cara Membuat Fanspage Facebook Dan Follow Twitter Melayang Di Blogp

Langkah-Langkah Membuat Fanspage Facebook Dan Follow Twitter Melayang Di Blog
1. Masuk ke Blogger 
2. Masuk ke Dashboard Blogger sahabat.
3. Klik 'Tata Letak'.
4. Klik 'Tambahkan Gadget'.
5. Pilih 'HTML/JavaScript'. 
6. Copy script dibawah ini dan masukan ke dalam gadget HTML/JavaScript tadi.

<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">Seikhlasnya :D</a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/acak acakan tapi penting?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=IfanAfwani&amp;show_count=&amp; show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe> </div>
<a class='close' href='#'>&times;</a>
</div>
Note :
Ganti huruf berwarna hijau dengan sesuka anda.(gunanya untuk menampilkan tulisan pada bagian atas widget)
Ganti huruf berwarna merah dengan halaman fanspage anda atau url halaman fanspage anda.
Ganti huruf berwarna biru dengan akun twitter anda.

7. Klik 'Simpan" dan selesai


silahkan sahabat cek hasilnya, kalau belum jelas tanyakan melalui komentar ya

semoga sukses !!!!!!!!!!!

Ditulis Oleh : Unknown ~ DosoGames

Muh.Akram Anda sedang membaca artikel berjudul Cara Membuat Widget Fanspage Facebook Dan Follow Twitter Melayang yang ditulis oleh sahabat kelor yang berisi tentang : Dan Maaf, Anda tidak diperbolehkan mengcopy paste artikel ini.

Jika Anda menyukai Artikel di blog ini, Silahkan berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di sahabat kelor

1 comments:

Back to top