17 June 2012

Tutorial Hide Cute Mini Music Player

Assalamualaikum ! ^^v
Peace ..

* Okie dokie , korang tengok laa dekat arrow dalam gambar .
Macam tu laa music player yang kita nak sorokkan ! ^^

 Untuk memulakan tutor ni , korang kena laa buad music player dia dulu baru laa kita belajar macam mana nak sorokkan dia .

Korang pergi >> SINI untuk dapatkan mp3 .


Dah masuk website tu , korang fokus dekat gambar atas ni pulak .
Haa macam yang Daya bulatkan warna merah tu , tukarkan 'General' kepada 'Colour' .



Korang tukar warna dekat bulatan yang warna warni tu 
(tak faham tengok gambar) .. Dah siap edit warna korang tukar balik 
dari 'colour ' kepada 'general '

 Dah godek-2 bahagian warna , sekarang jum pilih lagu favourite pulak ! ^^ Diminta korang pergi ke >> SINI . Dan !!!! Jangan tutup lagi website mp3 tadi .


Korang search lagu yang korang nak dalam box search yang disediakan .
Erm tapi tak semua lagu ada so ikut nasib lagu yang korang pilih laa . Hee
Untuk tutor ni , Daya pilih lagu Aku Suka Dia dari Hidayah Ya Ya !
Opss Ainan Tasneem * Haha nak jugak ><



Bila dah jumpa lagu yang korang cari tu , tekan tajuk lagu tau .
Jangan tekan button play tu pulak . Kang dia play je -.- * Tak faham laa tu . Haha



Haa yang ni penting , kalau tak tau buat yang ni nanti tak jadi . So fokus eh ^^
Copy semua HTML Embed tu , paste kan dekat mana-2 dulu . Contoh notepad !
Cari dalam semua code tu yang bermula dari http:// dan akhir dengan .mp3 ..
Contoh dari code lagu ainan tasneem tadi :: 

http://media.irondj.net/mix/file/20070/AinanTasneem___Aku_Suka_Dia__studio_version___lyrics_in_description____YouTube__1_.mp3
Haa amek code yang tu je lepas tu korang patah balik dekat website mp3 tadi . Jyeahh ! :D



Paste kan code tadi dalam tempat 'mp3' ..
Bahagian autoplay pulak pastikan korang tukar kepada 1 ! Jangan lupe ^^
Lepas tu kita biarkan website ni lagi sekali . Haha , pergi dekat design blog pulak ..

Ada dua step ! Ikut dua-2 ye ? 

* Step 1 ::

1 . Dashboard --> Design --> Add A Gadget --> Html/JavaScript
2 . Copy paste code ni dalam Html/JavaScript tadi .

<div id="ytube">
<div class="music">
CODE MUSIC PLAYER </div><div id="pict"><br /><img src="URL ICON" /></div></div>


3 . Merah >> Masukkan code panjang lebar dekat mp3 player yang Daya suruh tinggalkan sekejap tadi .
Biru >> Icon kecik yang comel-2 ^^ Daya ada bagi freebies sikit . Kalau nak guna , guna laa yup !

Freebies Icon ::


http://1.bp.blogspot.com/-MOVP_YwkN1Q/T4TLXiRWFJI/AAAAAAAAFek/bEfuo9WEXeo/s1600/7.png


http://3.bp.blogspot.com/-BAdabGm7mHI/T4TLa3S3qqI/AAAAAAAAFes/Bd5TUVQrK-g/s1600/purple.png


http://2.bp.blogspot.com/-_5fcEd-raQE/T4TLeKFYpzI/AAAAAAAAFe0/0d3t2xPXpzM/s1600/blue.png


http://1.bp.blogspot.com/-DZ7APUzVPZ0/T4TLi35IaSI/AAAAAAAAFfQ/2oHr_s84JmA/s1600/green.png

4 . Save dan Step 1 pon selesai ! Jum bergerak ke step kedua ^^

* Step 2

1 . Dashboard --> Design --> Edit Html --> Tick Expand Widgets
2 . Ctrl+F , cari code ]]></b:skin>
3 . Paste code ni ATAS code yang korang cari tadi tu .

.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 . Terus save sebab tak ada apa yang perlu di-edit ^^ . Haa lepas tu tengok laa blog korang . Lagu Ainan Tasneem pon mula berkumandang . Hee *blog Daya jelaa .

Sorry kalau tutor ni panjang lebar kalah karangan antarabangsa . Hee enjoy <3 And have a nice day people . Assalamualaikum !


5 comments:

Hanna said...

jom join GA nie ^^

http://apink221.blogspot.com/2012/06/speacial-giveaway-by-aiman.html

Hana Wonnie said...

Hana ikut tuto Daya yg ni, ok? :D

ziehah_luffy said...

time kasih,,,jenuh saye buat

Sieys!S said...

kalau blogskin xde ker?

Anonymous said...

hi yayahmiss93.blogspot.com admin found your website via yahoo but it was hard to find and I see you could have more visitors because there are not so many comments yet. I have discovered site which offer to dramatically increase traffic to your blog http://xrumer-services.net they claim they managed to get close to 4000 visitors/day using their services you could also get lot more targeted traffic from search engines as you have now. I used their services and got significantly more visitors to my blog. Hope this helps :) They offer most cost effective services to increase website traffic Take care. Roberto