Salam
Tutorial kali ini adalah request daripada Cik Syaza a.k.a Yann daripada blog
Sutera Kasih. Kod ni konfirm-konfirm bukan aku yang reka sebab aku tak tahu banyak pasal coding. Sikit-sikit dan agak-agak boleh la. Code ni pun aku gabung daripada beberapa tutorial yang aku jumpa kat tempat lain, sebab masing-masing ada code floating ads ni.
Contoh floating ads skyscrapper dengan button close comel kat atas
Secara ringkasnya yang aku pakai adalah code ini;
<div id="cry1"><div style='display:scroll; position:fixed; bottom:5px; left:5px;'><a href="#" onclick="document.getElementById('cry1').style.display = 'none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJJja_kTygPr55iDpS5zTwQm07ED02W9IcyiX9dw8J0xSaq0dygoreHoWsmYl4fWLxuX8JsM4gsD9FB9O3ZPQS8l13jXF04XR7YbY2mkkYnWEcrquk-0N8es5_11VPcdUYcdQdpcwhCBI/s1600/close-button.png" alt="Close" /></a>
<!-- Letak iklan Nuffnang di sini -->
</div></div>
1. Ubah posisi Iklan
Korang boleh ubah kedudukan iklan ini ikut suka hati korang dengan mengubah code di bahagian ini;
bottom:5px; left:5px
Korang boleh ubah bottom kepada top dan left kepada right. Part nombor 5px tuh boleh godek-godek try and error. Mengikut kesesuaian korang. Tak ubah pun tak pe. Ok je.
2. Image button close
Korang juga boleh tukar button close yang ada. Korang boleh cari kat Google dan gantikan code yang berwarna ungu tuh pada code button close pilihan korang. Ni aku ada senaraikan, kot-kot ada yang terminat mana-mana; (semuanya datang dari Google)
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJJja_kTygPr55iDpS5zTwQm07ED02W9IcyiX9dw8J0xSaq0dygoreHoWsmYl4fWLxuX8JsM4gsD9FB9O3ZPQS8l13jXF04XR7YbY2mkkYnWEcrquk-0N8es5_11VPcdUYcdQdpcwhCBI/s1600/close-button.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8kJLshg9WvcbkVhxLzhdIQuEtqB2JcO7EKlxa39z52nrthhMMW54-Q30WsiAKp9ZxgO9BiVQvtLAkXHTvKPYkqmkuUy3CTV9WrjL20zaYPbGlv3f9tJJ5ZtaNdlmVkbzoPF-BVgK5aIwa/s1600/btnCloseX.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9Dp9Vni_h-99KlmtuZsH8Cj16nazZRXvXhEOf1vuZ1cGz6Er-CJ-Fgobk1Hxu8ACGqs63GX5mDdiNSN_gkCo1xVUU7EKXc6_CIfCyWCcyJ-Fe2ubKQ543IctHBZyvKiAxEaT63oZ9kyLb/s1600/close.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirBQ1RUD7EyDrUck9mS17viZWbWLvDq7W_gKGAZJT0vyOxJ84nxdHgK0d7LYYCnvEFhQk22ZeEIuUD7_zW79vRKOklVmShAGkCjZNS-HRlRxnozX3ml-OWFu16Q-n4WEVKW8AOL2tXL6oh/s1600/close2.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_kSA0MSEsNNUQgoDQn8T7JpNqxZcv3wmZ-A_EUid15-0vSvjtiHFFvPG7eZi3fNtuIJdjrreIEMyVdQQhJwn5Cx8gQ3L8MrD9pm8qC7o_72yoIYWpnWdgiKHNkj7IMIfzL6TULIS0X4TE/s1600/close3.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUtq6PrMb09wl2qlFAOpKWcGsqy9mdNfrh45WqrwDynq-p2930M7OjvQ0FjgYhJdWA_WdJwaAxQ0uPd6ZZ2w1PNMqbC2BTdjaQPzfRyVNxzK_OyoxZ4btFGUKLpVuml-GfgaWYvk3stMYj/s1600/close4.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQvvyJhApjSRPlby8VTzKqr8wE-iUM1Fgzpf_nIXhfzlFnXnH7xceTg5j_0lcWDxnSLumBVhb1p6z5Rmten6oj99zzXXaUZ2_GLUt3BMNFaAcyu0-z999ihhMB_vVkMN0uB2dY7ckXyvfI/s1600/close5.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaggMHtPvmf_29qT9y0kdVilGMqRJ_OlYPLPgeJjQ_usqmAkAiYMCoAdOFcJ-4PHZ-w3fKaneBWfvOo61DIuYUSeenPU3torq2I64saMVp0RTKYUCHZziFJ1KaYJL0kv-Oazot0mOiyrgz/s1600/close6.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHUsSP_I_a-Jvau75IfStXgbmQYVriDPQTvKr6jstvyzWEnQFubXfEqRHegnOXAQftBXUEMbnx2GRu7BuCyCBsarRyjv9ZBrJFopM8-w7hpiDpM5yitSEtO4ZA_9SSDFxnJMjH0ZUA0S43/s1600/close-bar.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-UZExCVI3vPM_o_PP7LQyH1v4R2ioWS_pssJoK2Zlf40Bbt01knO5U6sSJMSsX4dRwJn2-NYM5YjkvX9ouyXrMVMskn50oHMWEOtXtS5sp5UAJawodRH3Y85C_mmnTrnKqvO1RhX9YgqU/s1600/CloseButton_ver845743.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirWfF1lrJCptVi0RJapu1llNYsZVnm6xGDMhBNy6XWf4gfDXsDNz1udus6E4Iag4Wjiw3n_IVOw9E81iNMz0tXR15ThS5NwmIcwJMRYaE549P4__brnJr_2YkGq7e6RJBXat4oiFC5oGY2/s1600/images.jpg
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCJMLJlQ_tiwja3ySPydWumID3KqeFhok5L8EuzlzENlb1fWWQs-7IncclxMyna148TbGgzofAeSAROSY8tHHsnaVEOqhl4AGcJVPVEXeO7rvEYnGjt5P-rGp05m4U_Azv1AWFatXK6ziS/s1600/close-x.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhb-pRpWcWZnL2SWbFVhs2GI_G4DVf-w-58QBz3hrCafTqNwL27z_uqL3PVoQsYht9f_QmgktdCLYhUAWSSayqy6ud2zSB68ncAUbWpbkk4Vw33PCdkR6G5wBdXjxWpya99YYtyTMCr3XXB/s1600/layer_notes_close.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVolWFOEcTUtXQvUvEDtz4Ul-hL_J19dJrLNDPvFRJxbdPELNfj5LthL1JBRucjRJzGwQz1A-3ozPlijRtEpDUVKZYFanMaN_ftnxTcgLWB5wRSiIit7UQ6RiqPWhuH-l1HCwC3x0v9brS/s1600/lightbox-btn-close.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBXsxg49Be8veHILdEYYcXQEHWNV9XNasqgcij8caRMwsRyUMR44cMNEMPJ_Qm8740ssi_7OIYsfoIEjO49qqRpTvzQ33SVXKGI-HWvRq5wbs7Hrrs6TEeiypv_jTk0FpcDAXZtKdo3E3z/s1600/subModalClose.gif
3. Letak kod iklan
Gantikan <!-- Letak iklan Nuffnang di sini --> dengan code pilihan korang. Biasanya orang akan pilih code Skyscrapper berbanding Leaderboard dan Large Rectangle kerana saiz Skyscrapper yang slim dan tidak mengganggu bacaan post. Aku sendiri pun penah cuba letak ketiga-tiga jenis dengan float ads ni. Mula-mula macam cool gila kan, lama-lama jadi semak. Haha. Sakit mata memandangnya. Cuba-cuba sampai berjaya ya.
Disamping itu, korang boleh je nak letak benda lain, macam gambar kucing ke, gambar pakwe ke, gambar sendiri ke. Tapi takleh letak gambar makwe, nanti kena ngurat
4. Cara nak letak dalam blog
- Pergi kat Dashboard, http://www.blogger.com/home
- Klik pada Design
- Klik pada Add a gadget
- Pilih HTML/Java Script
- Copy paste code di atas
- Klik Save
- Siap !!
Habis dah. Nanti kalau ada apa-apa masalah, tanya ye.