Ok, kali ni mau ajar korang sebab dah lebih 10 permintaan so tunaikan je lah??
Try tengok kat tepi blog aku ada button Instagram macam ni :
Kalau nak buat floating macam ni korang ikut step ni ye (rasa janggal sebab dah lama tak ajar tutorial)
1. Sign in blogger > Design > Add Gadget > Html/JavaScript
2. Copy code 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;'>
<style>.ig-b- { display: inline-block; }
.ig-b- img { visibility: hidden; }
.ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; }
.ig-b-48 { width: 48px; height: 48px; background: url(//badges.instagram.com/static/images/ig-badge-sprite-48.png) no-repeat 0 0; }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.ig-b-48 { background-image: url(//badges.instagram.com/static/images/ig-badge-sprite-48@2x.png); background-size: 60px 178px; } }</style>
<a href="http://instagram.com/puteri_nurfarah?ref=badge" class="ig-b- ig-b-48"><img src="//badges.instagram.com/static/images/ig-badge-48.png" alt="Instagram" /></a>
</div>
3. Tukar puteri_nurfarah kepada ID Instagram korang.
4. Kalau korang tak nak floating dan nak letak button je. Copy je code biru dalam sidebar korang.
5. Kalau nak letak banyak-banyak button macam aku punya. Rujuk tutorial ini ye. Tambah sebelum code </div>
macam code di bawah:
<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/AVvXsEiiE61zsfWbYsVm1eR6A0ka-O-z2piTK-kAaf67l5Wz0wyJAw0pZSNQM-dnjLSdA3ruAHsqnS6qO8hauizovMPcNfpTpy6PR_bvlX5vWP7JmQKntr6JXiwCL0dperX4tFGd0GpTVpdxuFA/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/AVvXsEgTuNJNHNG8Og9FENpEAdPRIuWDU7PDLuOwIDhz4nStP4hZlRHcOG91wvTeH2Wk6T_3vVPdx7rEwnl_CHhIDpDDzpbWKCRH48saYJ7XnpaPiyuLRkVVp2_pZOl0hlt3oKGfSPw-0C3J-YY/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='go to dashboard'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7JI0b7oPwiQmiRSxPUVfDnaPwW55rssaV_8pg1ej8Pz9wrho_nFbetc4z9WOO2MbkOD4zzEU6DDypGWo2n8tYyQXz6p2UrRzuR924FNUCVsF0DhZG6McSmSU5fT2So7QK7ggbLpU6V2Y/s1600/blogger_64x64.png" /></a><br />
#tukar code biru kepada ID korang. Hope rujuk TUTORIAL INI. (untuk lebih faham)
6. Try buat slow-slow, insyaallah jadikkk punya.
7. Lepas tu bolehlah SAVE.
Tak faham tanya..kalau I tak busy I jawabkan..kalau tak u olls study sendiri. Banyak tutorial I bagi. Kena peka ye :)
tq fer de tutorial!!! nnt nak buat lahhhh..hehe
ReplyDeletedah jadi. thanks :)
ReplyDeleteyesss akhirnya dapat juga belalang float button insta nie..thanz cik farah..da puas godek2 tuto before nie :) tq...
ReplyDeleteSalam akk, sy try buat utk instagram ni jd memang jd. tp kan, dia tak sama bentuk mcm icon twitter sy. mcm mne nk buat ek ? Hope akk boleh tolong sy :( . Thank you very much akk
ReplyDeleteTq :) Dah buat...
ReplyDeletesalam , maaf yerk mengganggu . mcm mana nak buat button fb , twitter , instagram mcm awak punya tuu yerk ? saya buat tak menjadi , hrp sudi bgitau cara2 nye . emailkan kat email nie yerk --> nfmmn2811@yahoo.com
ReplyDeletethanks :)
salam , maaf yerk mengganggu . mcm mana nak buat button fb , twitter , instagram mcm awak punya tuu yerk ? saya buat tak menjadi , hrp sudi bgitau cara2 nye . emailkan kat email nie yerk --> nfmmn2811@yahoo.com
ReplyDeletethanks :)
Thanks for tutornya :)
ReplyDeletetq..da jadi :)
ReplyDeletetQ sis.. tapikan kita buat button tu dia punya arrangement x selari dengan button fb and twitter.. cane nk buat bg selari? hehe
ReplyDelete*ayat skema :p
tq so much cik farah...
ReplyDeleteThanks for the tutorial. Really help me :D
ReplyDeletesalam.. kenapa saya xjumpa pon perkataan HTML/JAVA SCRIPT??
ReplyDeletenak cari kat mne ?
dalam DESIGN>add gadget> then??
xjumpa...
ap perlu saya lakukan
thankssss sangat for this tutorial. sukaaa haha :D
ReplyDeletethanksss sangat for this tutorial. :D sukaaa haha
ReplyDeletetq for this tutorial..untuk org yg tak baper reti mcm kkmia ni,,memg ok sangatlah tips ni..tq farah
ReplyDeletetq..really good info
ReplyDeleteAssalamualaikum. Asal terlalu ke tepi sebelah kiri sangat eh button ig I? Hehehe. Ni hah sis > http://penatanpanama.blogspot.my/
ReplyDeletetq dik atas tutorial ni..masih cuba memahami kod2 blog
ReplyDelete