OK langsung aja yaa...kali ini ane akan kasih cara pasang widget share botton menggunakan add this. Sebenarnya tampilan ini sih biasa aja...cuma masih dalam kategori widget...tapi enter dulu, walau sederhana tentunya akan berbeda dengan tampilan biasanya. Ini dia keunggulannya heheheee :). Nih widgetg akan melayang di blog anda...dan tempatnya juga di samping, serta dijamin tidak berpengaruh pada loading page anda. Ente Tertarik....ikuti langkah berikut ini.
- Log ini ke blog anda
- Klik Rancangan
- Klik Tamdbah Gadget
- Pilih Edit HTML/ JavaScript
- Masukkan script di bawah ini ke dalamnya
<style type="text/css">
#sharedock { position: fixed; bottomleft: 0; left: 0; width: 100%; height: 40px; z-index: 999; }
#dock { position: vertical; bottomleft: 0; font: 13px "Trebuchet MS", Verdana, Helvetica, sans-serif; }
</style>
<div id="sharedock">
<div id="dock">
<div class="dock-container">
<div class="addthis_toolbox">
<div class="custom_images">
<a class="addthis_button_facebook"><span>Facebook</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_facebook.png" alt="Share to Facebook" /></a>
<a class="addthis_button_twitter"><span>Twitter</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_twitter.png" alt="Share to Twitter" /></a>
<a class="addthis_button_myspace"><span>MySpace</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_myspace.png" alt="Share to MySpace" /></a>
<a class="addthis_button_stumbleupon"><span>Stumble</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_stumbleupon.png" alt="Stumble It" /></a>
<a class="addthis_button_reddit"><span>Reddit</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_reddit.png" alt="Share to Reddit" /></a>
<a class="addthis_button_delicious"><span>Delicious</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_delicious.png" alt="Share to Delicious" /></a>
<a class="addthis_button_more"><span>More...</span><img src="http://addthis.com/cms-content/images/gallery/addthis_64.png" alt="More..." /></a>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://addthis.com//cms-content/images/gallery/fisheye-iutil.min.js"></script>
<script type="text/javascript">
$(function () {
// Dock initialize
$('#dock').Fisheye(
{
maxWidth: 20,
items: 'a',
itemsText: 'span',
container: '.dock-container',
itemWidth: 30,
alignment : 'left',
valign: 'bottom',
halign : 'center'
}
);
});
</script>
#sharedock { position: fixed; bottomleft: 0; left: 0; width: 100%; height: 40px; z-index: 999; }
#dock { position: vertical; bottomleft: 0; font: 13px "Trebuchet MS", Verdana, Helvetica, sans-serif; }
</style>
<div id="sharedock">
<div id="dock">
<div class="dock-container">
<div class="addthis_toolbox">
<div class="custom_images">
<a class="addthis_button_facebook"><span>Facebook</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_facebook.png" alt="Share to Facebook" /></a>
<a class="addthis_button_twitter"><span>Twitter</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_twitter.png" alt="Share to Twitter" /></a>
<a class="addthis_button_myspace"><span>MySpace</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_myspace.png" alt="Share to MySpace" /></a>
<a class="addthis_button_stumbleupon"><span>Stumble</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_stumbleupon.png" alt="Stumble It" /></a>
<a class="addthis_button_reddit"><span>Reddit</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_reddit.png" alt="Share to Reddit" /></a>
<a class="addthis_button_delicious"><span>Delicious</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_delicious.png" alt="Share to Delicious" /></a>
<a class="addthis_button_more"><span>More...</span><img src="http://addthis.com/cms-content/images/gallery/addthis_64.png" alt="More..." /></a>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://addthis.com//cms-content/images/gallery/fisheye-iutil.min.js"></script>
<script type="text/javascript">
$(function () {
// Dock initialize
$('#dock').Fisheye(
{
maxWidth: 20,
items: 'a',
itemsText: 'span',
container: '.dock-container',
itemWidth: 30,
alignment : 'left',
valign: 'bottom',
halign : 'center'
}
);
});
</script>
- Simpan Template dan lihat hasilnya
- Kalau Tampilannya kurang enak coba anda gerakkan kursor anda di Widgetnya, nanti juga berubah sendiri
- Selamat Mencoba dan Sukses selalu