Tutorial : Hide Music Player (Part 1)

assalamualaikum , Korang tau tak macam mane bentu Hide Music Player (Part 1) tuu ? tak tau , tgok bawah nie :



BEFORE.

AFTER.

Jom kita mula sekarang ! Jom ! /terlebihsemangatpulakdah\ hehehe :D

1. Dashboard > Design > Edit Html > Tick Expand Widget
2. Tekan CTRL+F serentak /F3 search nie :

]]></b:skin>


3. Then , Copy code bawah nie dan paste dkad atas kod ]]></b:skin> 


.music {
padding:12px;
border-bottom-right-radius:5px;
background:#ffffff;
}
#ytube {
text-align: center;
position:fixed;
left:43px;
top:-55px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
z-index:999;
}
#ytube:hover {
top:-10px;
}
#pict {
height:35px;
background:#ffffff;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
width: 50px;
align:center;
}

4. Preview and Save ! 

5. Then , Page Element > Add a Gadjet > HTML/JavaScript

6. Copy code bawah nie dan paste kat ruang HTML/JavaScript


<div id="ytube">
<div class="music">
CODE MUSIC PLAYER </div><div id="pict"><br /><img src="http://dl5.glitter-graphics.net/pub/220/220645u9r9sjvsfp.gif" /></div></div>
7. Tukarkan

Warna Merah : ikut kesesuaian blog korang . klaw tak tukar pon tak pe :)
Warna Hijau   : Position music player tu, LEFT/RIGHT.
Warna oren     : Warna background. VIEW THIS COLOUR CHART.
Warna Pink     : Tukarkan dengan kod music korang 
Warna Biru      : URL IMAGE yang comel lote, korang boleh cari kat Glitter Graphics.


8. Save and vie blog , jadi takk ?

9. Klik SINI sebagai tanda terima kasih :D






 

No comments: