-->

Tutorial : Floating Button .

1. Sign in blogger > > Design > Add Gadget > Html/Java Script
2. Copy coding di bawah dan paste ke dalam Html/Java Script

<style type='text/css'>
a.linkopacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;}

a.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }
</style>

<div style='display:scroll; position:fixed; top:140px; left:-12px;'>

<a class='linkopacity' href='http://www.facebook.com/fara.idola' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisfqT59QwGcu-D0OK1mLmSwgXta6oAFkm05FiTt9ug5i8vdxipKf8Cdeai6MSkj-67QZya9Wc-2pFz14uVqamYEq_pfpijPSivbHfZac23dMyj3I2dtBwvxH1kePHbY9D8-HpVf-TE7e4/s1600/facebook1.png" /></a><br />

<a class='linkopacity' href='http://twitter.com/#!/fara_idola' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinpiGtyeMf2WRz80Bj_D9Nb9PIEBZp7FIOlNmiT3kOmMLZoU-2onPZ0VHAPxQsVuEfAGOQDJMgkf2lDw-ymc1Qukp2HNlqE1aUdPQ0HhxdQVUfk6WyXa53Ta8XWBznB3PrIBF9CgVwgM0/s1600/twett.png" /></a><br />

<a class='linkopacity' href='http://bicarafarah.blogspot.com/' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='blogger'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvwR95QPLChNG8N5-zyhpvEnjCmG2QD2W1Gvw-McRKVoh12X6G13Qhe7YLV1TSSPdQl1srdHKnMlc64gHKQ6dnTsEH8jB_tzWa1UD-iwPBWJzAfexQet5YXQelThpwvOUI3fC8Wg9AhDg/s1600/blogger_64x64.png" /></a><br />

</div>
3. Tulisan warna merah ialah link url korang ( contoh, Facebook, Twitter ), dan link biru link url gambar/icon. Kalau nak tambah lagi button copy tanda ni je sebelum code </div>
left boleh tukar kepada right kalau suka.
# Ubah font warna hijau sekali
4. Faham tak? dan SAVE je.

Kerana mood aku baik dan rajin. Aku edit dan carikan korang icon-icon yang sesuai diletak untuk floating button.  Tapi korang jangan la letak semua benda ni..nanti serabut serabai pula. Letak yang penting je k..


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy_EdzawvwUfpCtI_4rG8nGhit25Hv9OR6IBFEdXR8WuO_NA_0fz08RhZywDkLj51XOchSvPW0bM69RUM0wd0Wuo0bEvdMx-CHGRr74VVW7j96omSAJ4qBvOAJbFZC5lOauFrhqP-YAuY/s1600/blogger-icon-big.png

 https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9-dMjp2-fAGjiYEQxFstJbXymccVyvX0XAhT8K3mcMxTQJHNH-nc0QCWKAqIBI3mMAui5uieMCmEDkej_YZNmXWHx9SLe36UmHf3hwYmTzKoQf3jvFZF0sWkAPu5DD_6GTC796AeHHls/s1600/Facebook-icon.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5Ae6q5NIhVaZUZi5Xvc7yfc5KCTcfIkRc7iemEHUoiU-7Sf00HiUNC3GTc4JgDh2lvs0CiJv0FHDMlfbd7KIPk8QA5HMhP_gK5CEhgUdqmn2YZKQnH1ItCxUkMYM9xwc8U-rvmnJviTM/s1600/TwitterIcon.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIjKty-EsQrxFYeRybc0UP4225xwbK7xTeeAfdGThs05hqxIO31nvwilBLBBUDHoxugVBKosNpruny8L7dQ1BAZVSCJ4mTD0cQ2dNOsv9a8pzXnDL-EfZ9_X527j0YlWrOKAXLH5nvoUw/s1600/youtube-icon-PNG.png

 https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjv58sUn0ncl4b57myloIjT8SEKR5RNKgOJp-wvcRbFPCiFcFCPRI_2ocbsk2BNZ9GzNYOcBAhGn7fTMQTTGTpYRbjBrhowtlI5NVylvArcHBn9flvjVFmbJzDVHuKkWWZ7nJdXz2Jj3Mc/s1600/Skype.png

 https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhr6DdVz7Ud4KVx2EwHBLj1n37-4lcpB0q942y3B8BwoiymFj4Oi-YZ6fHCkQ3H_7ZyvzcH5p38GFW1DRcGSJTzH5aQbF-H4B70P4i4p0ZKAPWgp2jY6N2I-48bMFCbDTdZZ9fe8n2KaDU/s1600/Icon-Gmail.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGdrGHXcphumLDryxqT8v8U28BwbVbSN6-8EkOWFCzBbBFyPDyZClWd44p0oF3zLW0QsfqacEDdFSh7VxnbY4fEeklIdFu_zuZmnRWpzlrfQNOVN8KFQPjdpwhPHkHyCCnMSnxKOwHrH0/s1600/yahoo_icon.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhOqskUsmP_kx3OMwm6Xw8SSbLqb7Jd-437Gjok21oNgOfnlkjdKbFuMalO-e4T5afDZZPBRtfVYp6t_C61GxAaNOpLItlNMisHAM9BMZ2u0sBA_aq-USCBenlMFyZtEG972F-Ve3XIFc/s1600/Tumblr.png

 https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHflb3xVKVcq1GF9kjj5i6ECVR8bAm9m-Fbp2phWFuTDL5OQdK8FJG0x83iYCB0zGB-J-f0LoSsQsXn3Y5zr9EbDMUdZstWD3lQAiWXPz4XuUZo-jjZbPqP9IYbk7T8JgQxhAy3Dgfi7k/s1600/myspace-icon.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsE6ZK4aS8SFJL0ksQLc7NQXVv3tLzxXFd8J9I6NmXr3V0Ttz8XK42dcYYRJBw-gZZXQ9pQ_mAuKJp5Hbr1Jx7QL2npnH5zYQ_pCzEg-DPqCQvp0iPMS-4QDH_NjkWqRuHks7JEMR_E6Q/s1600/formspring.pn
Credit to : CikFarah.


Tutorial : Shadow Keliling Blog .


  • First , macam biasa . Dashboard >> Design >> Edit HTML
  • Jangan lupa tick ' Expand Widget Template ' !
  • Then , search or CTRL+F kod ini :
.content-outer {


  • Paste or CTRL +V kat bawah kod .content-outer { tu :
-moz-box-shadow: 0 0 0px white;
-webkit-box-shadow: 0 0 0px white;
box-shadow: 0 0 0px white;
  • Yang warna MERAH tu , ikut suka hati korang la . Sudah ? Preview , then save :) Suda siap !  


Exchange Link Blog.

Leave link at here !