Assalamualaikum..
Hyep.. Aloha loca people... hihii...
syaz nak buat tutorial .. hahaha... tutorial ni request by sum1..
dia RQ at ask.fm.. tak tau sapa... tapi xpa.. syaz bantu awak oke.. :)
tutorial ni boleh pakai untuk DENIM TEMPLATE / BLOGSKIN...
senang jee.. follow je k..
DENIM TEMPLATE
1. Dashboard --> Layout --> Add Gadget --> HTML/Java Script
2. Copy kod yang dekat bawah ni :
<style>
.cbox{
position:fixed; top:20px; right:10px;
padding-top:0px;padding-bottom:7px;
text-align:center;
height:20px; width:100px;
overflow:hidden;
border:3px solid #993399;
color:#888;
border-radius:100px;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
background-color:#FFFFFF;
z-index:999;
}
.cboxcontent{
padding-top:10px;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.cbox:hover {
border:3px dotted #993399; padding:15px; height:150px; width:330px;
border-radius:200px;
}
</style>
<div class="cbox">
<center>
<center>
<img src="http://i.imgur.com/fMhxnaJ.png" style="background:none;border:none;padding-top:0px;" /></center></center>
<div class="musicplayer">
<center> CBOX CODE HERE </center>
</div></div>
3. Dah copy?? Kalau dah . boleh PASTE kat dalam html korang tadi...oke...
4. SAVE.. boleh view dulu... (korang boleh ubah ekot suka korang sendiri)
p/s:
abc123 - yang ni untuk warna border korang.. tukar ikut warna pilihan sendiri
abc123 - warna background.. ( kalau nak guna background yang di upload.. delete "background-color:#FFFFFF", gantikan dengan "background : url(kod bg korang)"... oke..
abc123 - kod cbox/shoutbox korang
BLOGSKIN
1. Dashboard --> Template --> Edit Html
2. Tekan F3, then cari kod yang dekat bawah ni :
</style>dah jumpa?? ok next..
3. Copy kod yang dekat bawah ni pulak :
<style>.cbox{position:fixed; top:20px; right:10px;padding-top:0px;padding-bottom:7px;text-align:center;height:20px; width:100px;overflow:hidden; border:3px solid #993399;color:#888;border-radius:100px;-webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;background-color:#FFFFFF;z-index:999;}.cboxcontent{padding-top:10px;-moz-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;} .cbox:hover {border:3px dotted #993399; padding:15px; height:150px; width:330px;border-radius:200px;}</style><div class="cbox"><center><center><img src="http://i.imgur.com/fMhxnaJ.png" style="background:none;border:none;padding-top:0px;" /></center></center><div class="musicplayer"><center> CBOX CODE HERE </center></div></div>
4. Dah copy?? kalau dah... PASTE dekat bawah kod yang korang dah cari tadi...
5. PREVIEW dulu... kalau dah berkenan tu.. boleh la save... hihihi
p/s:
abc123 - yang ni untuk warna border korang.. tukar ikut warna pilihan sendiri
abc123 - warna background.. ( kalau nak guna background yang di upload.. delete "background-color:#FFFFFF", gantikan dengan "background : url(kod bg korang)"... oke..
abc123 - kod cbox/shoutbox korang
DONE... gud luck... hope tuto yang syaz buat ni membantu la erk... kalau ada apa2 pertanyaan . boleh tanya terus dekat syaz... :)
baru perasan,cbox Syaz unik.xpnh lg jmpa kt mna2 blog.tQ 4 de info Syaz.len ary t akk cba.pguna shoutbox pn blh pkai ka???
ReplyDeletesama2 akak zahhh... hihi.. boleh kak... cbox or shoutbox .. dua2 boleh pakai... :)
DeleteSalam...abak follow sni... pkongsian yg sngat bguna kpada warga blogger
ReplyDeletehyepp abakk.. salam... syaz dah follow abak balik oke.. thanksss :)
DeleteKak syaz terima kasih sangat-sangat. Dah dapat jimat ruang kalau guna chatbox macam akak :D
ReplyDeletewaw!.uniknya shoutbox akak!.=D
ReplyDeletenice! nt nak try la :)
ReplyDelete