Membuat Floating Button

Assalamulaikum dan hi!

Kali sis nak  ajar korang macam na kita nak orang tahu mengenai facebook, twitter, blog and so on. So kaedah nya ialah floating button. Floating button ni ialah button di tepi atas bawah tu tapi blh terapung.  Apakah fungsi floating button ni? Okeh, benda ni memudahkan reader connect dengan korang. Contoh kalau click button Facebook terus boleh tengok facebook profile korang dan sebagainya. Lagipun cara ini dapat ringankan blog korang. Korang dapat kurang berat blog korang. Contoh, kalau korang letak facebook badge, twitter badge atau sekawan dengannya memang memberatkan blog untuk loading tapi kalau korang guna floating button untuk connect dengan reader korang dapat kurangkan ber"kb-kb" berat badan ooppps berat blog korang.

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='https://www.facebook.com/amiranajihahlove95' 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/AVvXsEhjOIq5fS1Yl2cb2sg02aQVT7dxKpuhVgjbhu_RKEP9dXuvMKo8irNoZf2R2LzaJmvVv2ji4TQfVUAb40voMzG90ZnvJGR_EWq2T7yc6KWLBCAYzPMePWBZEswcOZJnSK9B2ianm-aauBg/s1600/Facebook-icon.png" /></a><br />

<a class='linkopacity' href='https://twitter.com/AmiraNajihah95' 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/AVvXsEjvOI38lpfMVsodvDAQ7VB_4zMT9MGNHwcBjqA39vSRQl7y8LRJqR0EUgYOAnqLkdACm49CJKi1F-EqQq5dYLcBM54dOKBqJ0Za9dr1vpJSlDUJ_vII-qU6dpznxvRRifAv3Fckn-9DRU0/s1600/TwitterIcon.png" /></a><br />

<a class='linkopacity' href='http://amiranajihahstory.blogspot.my/' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='go to dashboard'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpC3bz-My3QmUbuhMVypHIGh1z6mmxTfxcWVjC2fiGv4hdvupp7mqYqWuGbXjVgrdGMj_0iQybFBUSjvg0hnawaa60L9nbzQzSXH3xePmoSIkEA8sIznT7gWi3JQRoMThSptT1cTDskcw/s1600/blogger-icon-big.png" /></a><br />

<a class='linkopacity' href='https://www.instagram.com/amira_najihah95/' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='instagram'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRTu0AfhqOGOpkLZbmIeAUuORECYck4d9KzNRDhx6Vr1RIp3EjK5KcXCOu2LZU3GflCmLSdEPag8tOeEwuVp1Ir0q2WA-7F-HSx68VIGuB_MsjanfCS0Z620BaLxaReTmwU3Dh6ODqYG-K/s1600/inst46.png" /></a><br />

<a class='linkopacity' href='https://plus.google.com/u/0/106217138736845035899' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='googleplus'><img border="0" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPFvPWEZ_WWzp3vEUbfAhGJ8VY_QWVyylKAAUmU2wWgI0ATKidgGg26nvqz2Ge4koY_WzbGjjGBwgv-0aJgfCdeQ-WX6ihOoF0Sfk9_ufz196Fl6QSI1-9tudYDfUCYZeeOwx9l6qDNC_i/s1600/googleinst46.png" /></a><br />

</div>

Settle da!




Note:

Kalau nak tambah lagi copy mana n ubah yang aku highlight hijau.

Ubah ya highlight hijau kepada link di bawah

Google Plus

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPFvPWEZ_WWzp3vEUbfAhGJ8VY_QWVyylKAAUmU2wWgI0ATKidgGg26nvqz2Ge4koY_WzbGjjGBwgv-0aJgfCdeQ-WX6ihOoF0Sfk9_ufz196Fl6QSI1-9tudYDfUCYZeeOwx9l6qDNC_i/s1600/googleinst46.png

Instagram

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRTu0AfhqOGOpkLZbmIeAUuORECYck4d9KzNRDhx6Vr1RIp3EjK5KcXCOu2LZU3GflCmLSdEPag8tOeEwuVp1Ir0q2WA-7F-HSx68VIGuB_MsjanfCS0Z620BaLxaReTmwU3Dh6ODqYG-K/s1600/inst46.png

Tumblr


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_bAIN5sTjcjiE4zwhkwpVd_BHnO_T46xRP6Wv0cNV_Yd1yCvHYv0_P6uF0CEwKb4BxOK-S0vYzV23hnG0Kt9vkbhuoXJcH67x0HvDnSnGErvBX9BkWCYJX-2wOlnswGJEoDsEfrFsVtk/s1600/Tumblr.png

Yahoo Messenger (dulu aku ada)

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIbVZHqUkbbN0OUP1Svh7a2lKdQWvlLKHmVH7FlTcX0Zk98zFHmJ25E8h4R00SX0LG0ixA7ziT5-5zxbMU0w6V9ddirhoanTYjDnH9k5lmZV6efRjkfXdy89Uhip638x8eCXm4kW8fLDk/s1600/yahoo_icon.png

Skype (aku pun ada tapi jarang buka)

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ_pyBTLDcd2TZDspkmAk5wJAtNshSXaU7o3LSyruLJ_DUHIS7oy7C0OXKWJDAC-nzJoLqBD0DlZf1l1_b2ZXQiR1nqd1jwuOtrtxc3EJf0mNncowh-atSU16vnSjSFbG7054W9gFr9M8/s1600/Skype.png


Youtube

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