Mahu Letak Floating Icon Di Tepi Blog?

Kali ni, saya nak shara cara-cara untuk letak icon2 seperti facebook, twitter, feedburner, youtube, & flickr, serta home & back to top button..

1st sekali, pi kat Dashboard > Page Elements > Add a Gadget dan pilih Html/Javascript. Copy dan pastekan coding kat bawah ni di gadget tersebut.

<br></p><blockquote><div style="color: blue;"><style type='text/css'></div><div style="color: blue;">a.linkopacity img {</div><div style="color: blue;">filter:alpha(opacity=50);</div><div style="color: blue;">-moz-opacity: 0.5;</div><div style="color: blue;">opacity: 0.5;</div><div style="color: blue;">-khtml-opacity: 0.5;}</div><div style="color: blue;"><br> </div><div style="color: blue;">a.linkopacity:hover img {</div><div style="color: blue;">filter:alpha(opacity=100);</div><div style="color: blue;">-moz-opacity: 1.0;</div><div style="color: blue;">opacity: 1.0;</div><div style="color: blue;">-khtml-opacity: 1.0; }</div><div style="color: blue;"></style></div><div style="color: blue;"><br> </div><div style="color: blue;"><div style='display:scroll; position:fixed; top:240px; right:-12px;'></div><div style="color: blue;"><br> </div><div style="color: blue;"><a class='linkopacity' href='<b style="color: rgb(255, 0, 0);">http://facebook.com/akaun facebook anda/</b>' 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/AVvXsEi8RkFhfxHC155u_rbtn_ILWLCLuXx2Cs0bxNJhdS0MML55Tq5wfBDdCK3g4xgtO-N1tRy1eMhWHDy3mVtQ7jxhD9TwLA2erqyDlIqCASQAI9pPsu257pNZsI-Ps3eulygoYkUL4k4PEKL7/s320/facebook.png" /></a><br /></div><div style="color: blue;"><br> </div><div style="color: blue;"><a class='linkopacity' href='<b style="color: rgb(255, 0, 0);">http://twitter.com/akaun twitter anda/</b>' 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/AVvXsEhRKiTLbJlMmClX_xOF_RPtUQEHTaKVmNFYHwaQ8ERWIJyeoK2CfSyfRmtxED7o4QYEUK_USyZu-o4TiIhhJ_o4pY5CsDrzOD3aQGAa0QA2bMYaVqcWUF9IauBXq5VnrNuJieUkZ0AbsOCu/s320/twitter.png" /></a><br /></div><div style="color: blue;"><br> </div><div style="color: blue;"><a class='linkopacity' href='<b style="color: rgb(255, 0, 0);">http://feedburner.com/akaun feedburner anda/</b>' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feedburner'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTt12EKXwKxmoYavzjKmIjh5oG2fzacLze2fAiKud82EwSc8ShcRzNao8lsJouC9FWBmX2wnC-eUZrgunEkS7Idpwdsdztz8_Q81KNpmaC-eeFhvCLWy5iAs-MXQ4Hk4FPaxSveCu_LRbI/s320/feedburner.png" /></a><br /></div><div style="color: blue;"><br> </div><div style="color: blue;"><a class='linkopacity' href='<b style="color: rgb(255, 0, 0);">http://youtube.com/akaun youtube anda/</b>' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='youtube'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiANtu7f9D6cdg7pfCwsayBD8Qik4h3qj1OsncYmX85JkvGQGJKh0jz3Bzdfn2X0SfNNXlZQojptsrnLjj1F3nROowjvHVEG_v7XzpiXrLe1SB5OKffYIx6A-DoNfRgRGNR64esaOkH2DXn/s320/youtube.png" /></a><br /></div><div style="color: blue;"><br> </div><div style="color: blue;"><a class='linkopacity' href='<b style="color: rgb(255, 0, 0);">http://flickr.com/akaun flickr anda/</b>' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='flickr'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIHMj_ZU1xH3J3VefPAJmyptqFYkh0nBkyz_8dQIUtfbbsK7MhDl8PzSCPZ6Unk3BHPbkF_lvNFW5rHSMNarsY1YByyKHPoGoFOeWOOV2b8zwbqlllJGpnOSzd57vw4tYaOa-_rY_M5FTs/s320/flickr.png" /></a><br /></div><div style="color: blue;"><br> </div><div style="color: blue;"></div></div></blockquote><p><span style="color: orange;"></span>

Sebelum save, jangan lupa untuk letak alamat akaun uols. Sekiranya takmo letak let say flickr, then uols just buang ajela coding untuk flickr. Kalau rasa dah bosan ngan icon tersebut, uols leh tukar icon2 lain di http://www.iconspedia.com.

Dah setel tang icon, jom tengok coding untuk letak home & back to top button. Uols nak asignkan pon boleh, or nak paste kat ruang content Html bagi icon kat atas tu pon boleh. Macam saya, saya asingkan.

</p><p><a href='#' style='position: fixed; right: 1px; bottom: <span style="color: rgb(0, 0, 255);">100</span>px;' title='back to top'><img height="21" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5Ggv8cUMHQS8iebC1_oIXMhx_zPkLbyN2OfXkn3sgLOKVaDruagAczNtQqwju_AI6eyclVrLkYcdG4LviSIn-XUBMyCrsJJ0bP4sACZeJqsU8V-L6hmOhO4wX28BBeriLZpNfV70K2fU/s320/up.png" width="21" /></a><a href='<span style="color: rgb(255, 0, 0);">http://myapeapeaje.blogspot.com</span>/' style='position: fixed; right: 1px; bottom: <span style="color: rgb(0, 0, 255);">129</span>px;' title='home'><img height="21" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIYvaUX0age05inD_iJrxTcv27VJV1O2pVvBBwEZ_zdQeC5gKJxGPZt6_tABPyJEkqlruE8Yx0c0szINA0MRGsO1JrM3rPtSfLbCxJg_6QE7ogzI1A8M76GzOfBN5RP9dL1eibA7pDyH8/s320/home1.png" width="21" /></a>

Kalau perasan, ade bottom: 100px, yang kaler biru tu uols leh tukar position mengikut kehendak uols. Sekalii lagi, jangan lupa untuk tukar kepada alamat website uols. Selamat mencuba.. ^_^


p/s : Kredit to MariBinaBlog