Translate

Friday, 7 June 2013

Cara Menambah Twitter Follow Box di Blog

cara menambahkan facebook di blog
Assalamualaykum sahabat, Alhamdulillah setelah dua tips  yang lalu admin membahas tentang seo tentang cara mendapat baclink dari web terbaik di mata google dan cara mudah merampingkan alexa dengan cepat dan mudah,Dan untuk pertemuan kali ini admin ingin berbagi tips tentang cara membuat cara menambahkan facebook blog.

Bagaimana caranya, Oh iya untuk demonya sahabat bisa lihat like box yang admin pakai pada blog sederhana admin ini,Untuk caranya sangat sederhana sahabat hanya menambahkan code di html/javascript
Ok kita menuju tkp ya sahabat.

Untuk caranya pertama:

  • Pertama sahabat login di akun sahabat,Setelah sahabat masuk dasbor sahabat pilih tata letak,Kemudian click tambahkan gadget,Kemudian sahabat cari/pilih Html/javascript.
    hingga seperti gambar di bawah ini:
cara menambahkan facebook di blog
Selanjutnya sahabat copy code di bawah ini dan pastekan di area konten seperti gambar di atas.

<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 ya sahabat</a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/Tips-Blogger-dan-Computer/240673399395615?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=sartonowadowo&amp;show_count=&amp; show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe> </div>
<a class='close' href='#'>&times;</a>
</div>

Seperti yang sahabat lihat ada 3 warna yang admin tandai di code like box.

  • Untuk yang berwarna merah sahabat bisa ganti dengan kata-kata yang sahabat inginkan.
  • Yang berwana kuning sahabat ganti dengan code like box facebook  sahabat.
  • Dan yang terakhir warna hijau ganti dengan nama akun twiter sahabat.
Mungkin itu yang bisa admin bagikan cara menambahkan facebook di blog pada kesempatan kali ini,Mudah-mudahan bermanfaat dan ahir coretan wassalam.
 

Like this

Cool Red Outer Glow Pointer
.