Thursday, March 20, 2014

Cara membuat like box melayang di blog

Assalmmualaikum wr.wb

Kalian Pasti pernah melihat penampakan seperti ini

fungsinya untuk mempromosikan fanspage facebook kita,,, selain mudah dan praktis, dengan cara ini juga sobat ga usah ribet-ribet banyak kolom karena akan muncul sendiri di depan layar selain itu ini juga otomatis membuat semua orang mengetahui like box ini pada saat orang membuka blog kita.

ya udhlah saya gx mau panjang lebar langsung ajah ikuti langkahnya dengan TELITI

1. masuk ke dasbor/home
2. klik tulisan tata letak, klo ga tau tempatnya keterlaluan bgt... nih screenshot nye



3. klik tulisan tambahkan gadget, terserah pilih yg mana kan banyak tu kolomnya


4.nanti akan muncul windows baru... silahkan kamu klki tulisan HTML / Javascript
5. masukan kode 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">Like juga Fanspagenya di Facebook</a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/ahmadrofiiblog?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=AhmadAnyar&amp;show_count=&amp; show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe> </div>
<a class='close' href='#'>&times;</a>
</div>

Cara  mengeditnya...
  • yang berwarna merah itu buat judulnya
  • yang berwarna biru itu buat alamat fanspagenya
  • yan berwarna kuning untuk twitternya

PERHATIAN !!!!!
d blog saya tidak bisa klik kanan, jadi sobat harus blok dulu semua teksnya, terus klik CTRL+C bersamaan... jika sobat ingi tempat untuk mengedit codenya, saya udah mempersiapkan tempatnya



setelah itu klik save

 taaaaaaarrrrrrraaaaaaaaaaaaaaaaaaaa !!!!!!!!!!!!!!!!!!

baca juga postingan
  1. Cara mengubah cursor mouse di Blogger
  2. Indosiar Tv Online
  3. Bali Tv Online
  4. SCTV online tv
  5. Anggry Bird Games Online
  6. Kingdom Bow online
  7. Sonic Games Online

No comments:

Post a Comment