Floating Ads, Iklan tergantung untuk Nuffnang, Innity, Advertlets dll beserta dengan button close, close png
SalamTutorial 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
Ada tutorial floating ads yang guna coding yang panjang, Floating Ads by Jj. Ada juga coding pendek, Floating ads by Amirez. Dan ada juga coding floating ads dengan close button yang boleh ubah tempat by Jejaka Terhangat. Jadinya korang boleh baca-baca dan gabungkan knowledge-knowledge yang diorg kongsikan kat situ.
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>
</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
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.
70 comments:
errr ika xphm pe2 >_<
@Afikah Aziz
erk .. tak paham ke .. alamak ..
bgos iPai..selalu org buat floating ads nuffy nie x de close button..so agak semak siket..suka2 yg ade close button..hhii
waa waaa..
aku nak wat juga lah.
hihih...
oh, dari yan pula.
huhu
~~ cepat ke lana reply semalam?kebetulan je tu,hahahaha. lana insyaAllah, selagi pendapat tu bernas, lana terima.. ipai nak komen mcmna pun, lana cuba ambik pot, fikir dulu sblm bertindak ;)
ipai..lana lama dah nk tnya ni..kenapa dah tak psg shtbx T__T
hurmm..lana pun..tak terbalas semua :) standard lah tu.. kita manusia biasa..takkan mampu terkejarnya.. tak kisah kalau ipai tak pakai ke apa..cuma ni dari pnglmn lana, bila someone tingglkan komen..pada masa sma dia tinggl jejak kt shtbx utk menunjukkan diri dia dah sampai..
kadang2 diorg bukn komen entry kita yg awal2..entry lama2 jugk yg diorg baca.. dan kita sbg owner,kdg2 terlepas pandang..
~rasa2 ipai paham tak apa yg lana cuba sampaikan? pagi2 ni..slow skit otak ni,hahahaha
oo bru tau
Salam. Bagus perkongsian ni. Saya pernah mencarinya dulu ... :) sekarang baru jumpa tetapi sekarang dah malas nak wat .. hehehhehe
ipai,kalau camtu.lana pun sengal jugak lah,hahahahah. sapa yang tak suka kalau comments number tu banyak,hahahaha. takpalah..memg,pasg shtbx, bermkna tanggungjwb tu lebih lagi..tak bls, rasa bersalah pulak.. T__T
Lana ni pun,slagi mampu..pakai la jua,hahaha. oh ya..un-autopublished tu..mcmna nak buat?hahahahah.sengal lagi,hahahaha
Perkongsian yang baik...tq
good information..
ooo...baru tau..
button close tu comel2..hehe
wakakaaa .. ika x paham. iPai x pas jadi cikgu.
heheeee ... terrer ngan koding eh! nanti tlg acik godek kod boleh? acik nye blog tak macam yg acik nak! :(
Ha yg ni ada close button, better than yg xda close button..& sy suka floating adv kat blog iPai ni, sbb dia x cover gadget lain..ada sstgh blog tu da la xda close button, cover gadget pula..huhu..inconvenience..
ipai..thanks ya :) bagus2..xlokek ilmu :) urmm..nanti lana cuba..skrg mengantuk..masa untuk tido kejap je,kejap je,hahaaha
wewitt ipai pn dh bertuto skg. xDD
ohh baru tau koding ni. nt terasa nk pakai leh letak. hee. simple ohh.
siap ade button close okeh lg. ade tu takde button close. dh xdpt nk main2. huhu.
grrrrrrrrrrrgrrrr
ermmm tolong buatkan lah~
thanks ipai !!!
sgt2 membantu..terharu sbb ipai buat tuto ni hihi :P
sbgai balasan, letak link tuto ipai ni dlm koleksi tuto d blog saya :)
ok menjadik lah ipai hehe tq !
nama blog yg kt atas nie yer? bkn url kan?
a'a, izfa tukar.. np ipai?
wah tutorial..:)
wakakaaa ... patut ler iPai panggil Acik ika! saspen gak tadi. alaaa ... ika kat atas tu silap taip ler! acik la bukan ika, hokeh! :)
nice la bro :)
pandai buat tuto eh .. hehehe ..
then yg bagusnye floating ads ni ade close button tu yg best :D hehe
takde r menyemak ..
banyaknya icon bro =_= .. huhu
waaahhh..kdg2 jumpa iklan nuffnang yg float ni tanpa button close..senang sikit kalau ada..rasa tak nak tgk je..tekan la close...(^^,)
waahh.. cun2 ^________^
tp mals na buat..heeeee
good sharing tapi sayangnya arisha tak ada nuffnang. huhu.
tapi ada kelebihan ke nuffnang scroll ni..ada kelebihan bab BE ke ipai? bro pernah pasang benda ni..sebab bro buang mcm mengangu pembaca..tapi ada buton x ok la kot,
Mekasih kongsi... rajinnye cari code button nih :)
toturial yg bagus.. tapi aku punye cam salah setting la.Ok tak iklan nuff aku yg float tu?huhu..
ala..semak la sume ni pai..aku klu bole nk je cabut iklan2 kt blog tu.bt berat je..duit nya x de la masyuk sgt.
@syaz@rozelt
yup2 .. boleh tambah n edit ikut kesesuaian kita ..
@mr_mrs mikko
buat jgan tak wat ..
@TYNTHA LANA
cepat juga laa ..
@cik wanie Lovela (CWL)
harap cik wanie leh cuba ..
@HasrulHassan [HH]
nanti hasrul dah rajin try buat ..
@Ellen
trima kasih ..
@lala shaheila
harap shaheila boleh cuba ..
@syarifahsidrus
hee, memang cari yang comel2 je .. hehe
@Acik
nanti kontak2 ye. ..
@Aemy Shamy
harapnya memang tak mengganggu r .. tp kalau orang yang pakai IE mesti ganggu ..
@TYNTHA LANA
jangan terlajak ye .. heee
@Tea
hee, tuto yang kecil2 saya tau laa .. yg besar2 saya tak tau ..
@Tea
yup2 .. pilih laa close button yang lawa2 .. hee
@mesuya
eh suya nak org buatkan ke ?
@[sutera kasih]
trima kasih syaza .. terharu .. dah tgk .. memang terharu ..
@[sutera kasih]
yeay .. harapnya menjadi r .. sama2 ..
@izfanora
takde pe .. cuma cam heran2 seketika .. heee
@atiyahkaman
hee, yup .. turorial ..
@Acik
sori tersalah acik aka ika
@alif haris
cuba bro try .. hee .. thnax baca ..
@Freaky
hee, kasi banyak pilihan ...
@Ezad Skytech
tu laa .. kot2 ada yang mengganggu, leh tekan close ..
@SoLy SoLicious
eh malas .. nanti rajin buat k ..
@Rtp Farra Arisha
arisha pasang je .. pasang dan biar .. macam lebih kurang sama tak pasang je ..
@Bro ahmad
hee, takde kelebihan kat BE .. sama je, cuma bila orang selalu nampak, ada yang nak tekan2 ...
@abglan
sama2 .. memang simpan satu dalam notepad .. heee
@Anif Abdullah| AA
ok dah tuh .. leh adjust2 lain je ..
pandai nyer anak mak! sy x reti bt..hihi..
paham!! tapi... iklan kat tepi blog aq macam dah full la... rasa macam menyemak lak.. T^T
thanks for sharing. nnt nak buatla. hihi
mantop XD
saya search dekat google untuk buat float ads. encik ipai punya page ni 1st in rank kot kat first page pulak tuh. cayalah.
and the tutor is superb. easy. thanks. :)
terima kasih =)
thankz for info....sya bru lgi dlm blogging ni..dpt jgak ilmu bru kt blog saudari...tq so much..
http://farishhaikal.blogspot.com/
Thankz for info bro....aku bru dlm blogging ni..dpt byk info berguna dri blog anda ...tq so much
http://farishhaikal.blogspot.com/
apakah boleh memasang iklan innity melayang/floating
terimakasih :D
its not working to my blog ...
http://silipsilip.blogspot.com
Perkongsian yang bagus dan menarik, belum pernah cuba lagi..
Post a Comment