MEMBUAT ICON SHARE DI SAMPING BLOG

SEBAR LUASSetiap postingan dan artikel yang telah kita terbitkan kadang ada keinginan di hati kita 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 kita coba belajar membuat share icon berada di posisi samping kanan pada blog kita seperti terlihat pada gambar di bawah ini


Membuat share Icon untuk berbagi ke facebook ,twiter,google,maupun digg yang rencana kita letakan di samping blog kita 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.

Sumber : http://web.gallerydunia.com/2011/03/membuat-icon-share-di-letakan-di.html 

MEMBUAT ICON SHARE DI SAMPING BLOG
Item Reviewed: MEMBUAT ICON SHARE DI SAMPING BLOG 9 out of 10 based on 10 ratings. 9 user reviews.
Emoticon? nyengir

Berkomentarlah dengan Bahasa yang Relevan dan Sopan.. #ThinkHIGH! ^_^

Komentar Terbaru

Just load it!