Bayi dan Anak

More kode warna »
Headlines News :
Home » » Cara Membuat Icon Share di letakan samping blog

Cara Membuat Icon Share di letakan samping blog

Cara Membuat Icon Share di letakan samping blog, merupakan postingan kali ini dimana setiap postingan dan artikel yang telah diterbitkan kadang ada keinginan di hati untuk sharing ke situs jejaringan lain nya seperti facebook, twitter, google maupun lain nya sebenar nya banyak berbagai macam bentuk gadget share namun di postingan ini mencoba belajar membuat share icon berada di posisi samping kanan pada blog kita seperti terlihat pada gambar di samping.

Membuat share Icon untuk berbagi ke facebook ,twiter,google,maupun digg yang rencana diletakan di samping blog seperti contoh di web ini cara nya cukup praktis.

1. Anda login ke blogger.
2. Pergi ke RANCANGAN / Element laman
3. Tambahkan GADGET terserah di posisi sidebar mana aja yang anda pilih.
4. klik tambahkan HTML/JavaScript
5. Terus Copy seluruh  kode di bawah ini 
6. Simpan


<style type="text/css">
*{margin:0;padding:0;}

* html #z33sHare{
position: absolute;
}

#z33sHare{
right:1%;width: 70px;background:transparant;border:0px solid #E7E7E7;-moz-border-radius:3px;-webkit-border-radius:3px;
position:fixed;
top: 20%;
}

#z33sHare div{
padding:6px 6px 6px 5px;
}

#stw{
margin-left:-2px;
}

#sfs{
margin-left:-5px;
}

</style>
<div id="z33sHare">
<div id="ssl-box">
<div id="stw">
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</div>
<div><a title="Post to Google Buzz" class="google-buzz-button" href="http://www.google.com/buzz/post" data-button-style="normal-count"></a><script type="text/javascript" src="http://www.google.com/buzz/api/button.js"></script>
</div>
<div>
<script type="text/javascript">
(function() {
var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0];
s.type = 'text/javascript';
s.async = true;
s.src = 'http://widgets.digg.com/buttons.js';
s1.parentNode.insertBefore(s, s1);
})();
</script>
<a class="DiggThisButton DiggMedium"></a>
</div>
</div>
<div><a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script></div><div style="clear:both;"></div></div>


catatan :

Untuk kode yang di cetak tebal dan merah ( top: 20%;)  bisa anda rubah ukuran ketiggian nya sesuka anda..bisa 30%,40% maupun dengan menggunakan px seperti 35 px.
Selamat Mencoba
Share this post :

Posting Komentar

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Priyayi Alit blogger Karawang - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger