Pasang Lagu Menggunakan Pilihan Skin MP3 Player Di Blog

Selamat berhujung minggu. Kali ni aku nak cerita camana letak lagu dalam blog. Bagus untuk yang berminat dan masih tercari-cari walaupun blog sekarang nih agak kurang popular.

Banyak program yang tawarkan lagu mp3 untuk didownload; ambil sumber asal dari YouTube atau SoundCloud. Masalahnya majoriti program ni tak sediakan skin mp3 player untuk diletak

dalam blog. Ada masanya nak download link lagu pun tak boleh; tak padan dengan iklan yang keluar 3-4 kali sebelum kita dapat link tersebut, itupun kalau dapat.

Tak ingat kat mana ntah komen ni...

Bila kita tahu mereka ambil dari YouTube; guna YouTube sajalah untuk masukkan lagu dalam skin mp3 player yang kita pilih/ada. Tukar link tersebut kepada link mp3 (hujung link ada .mp3). Program terbaik adalah ListenVid. Nanti aku tunjuk sekali bagaimana nak guna ListenVid.

Sebelum lupa;
~ Semua program yang aku ambil untuk cerita kali ni adalah percuma tak payah nak register bagai,
~ Segala kod berwarna merah boleh diejas sesuka hati ikut kesesuaian blog,
~ Kalau nak buang Tajuk Lagu, buang keseluruhan kod yang ini: <div style='width:XXXpx; background:transparent; font:YYpx Comic Sans MS;'>Tajuk Lagu</div>,
~ Nak pilih kaler boleh tengok sini; sini; atau sini, dan
~ Semua kod dah dicuba dan boleh guna selagi program tu masih hidup dan kod MP3 skinnya tak ditukar.

Haaa meh tengok satu persatu:
1. Program tawarkan lagu mp3 dan tersedia skin mp3 player

1. Program yang sediakan skin mp3 player yang sama.

1. a) Antaranya MP3 Juices; MP3 Raid; dan MP3 World
Paparan skin MP3:

<div style='width:250px;background:transparent;font:12px Comic Sans MS;'>Tajuk Lagu</div><embed type='application/x-shockwave-flash' src='https://mp3-juices.com/inc/jplayer/mp3player.swf' flashvars="file=http://link lagu.mp3&volume=50" quality="high" allowscriptaccess="always" height="20" width="250"><br /></embed>

1. b) MP3 Downloads
(Ada butang Stop tetapi tiada butang Download)
Paparan skin MP3:

<div style="background: transparent; font: 14px Comic Sans MS; width: 300px;">Tajuk Lagu</div> <embed src="http://www.mp3-downloads.net/flash/playlistplayer.swf" width="300" height="20" flashvars="height=20&width=300&file=link lagu.mp3&showstop=true&autostart=false&skin=http://www.mp3-downloads.net/flash/controlpanel.swf"></embed>

1. c) Cincopa
(Lebih lengkap dengan fungsi ubah warna - Sebenarnya kena register dulu tapi aku dapat kat mana ntah)
Paparan skin MP3:

<div style="background: transparent; font: 14px Comic Sans MS; width: 300px;">Tajuk Lagu</div> <embed width="300" height="20" src="http://www.cincopa.com/media-platform/runtime/player4/player4.swf" wmode="transparent" type="application/x-shockwave-flash" flashvars="file=link lagu.mp3&amp;showstop=true&amp;frontcolor=cc0000&amp;lightcolor=000000&amp;autostart=false"></embed>

2. Seek A Song
Paparan skin MP3:

<div style='width:280px;background:transparent;font:12px Comic Sans MS;'>Tajuk Lagu</div><embed src='http://www.seekasong.com/mp3player/player.swf' width='280' height='30' allowscriptaccess='always'allowfullscreen='false' flashvars='file=http://link lagu.mp3&skin=http://www.seekasong.com/mp3player/seekasong.swf'></embed>

3. Kiwi6
Paparan skin MP3:

Ini kod lama tapi masih berfungsi. Kod baru guna iframe dan boleh terus paparkan banyak lagu (tracks) tapi perlu melalui link yang disediakan oleh program ini.

<div style='width:300px;background:transparent;font:12px Comic Sans MS;'>Tajuk Lagu</div><object type="application/x-shockwave-flash" data="http://kiwi6.com/swf/audio-player.swf?audioUrl=http://link lagu.mp3" id="audioplayer" height="27" width="300" allowscriptaccess="always"> <param name="movie" value="http://kiwi6.com/swf/audio-player.swf?audioUrl=http://link lagu.mp3"/><param name="FlashVars" value=""/> <param name="quality" value="high"/><param name="menu" value="false"/><param name="allowscriptaccess" value="always"/><param name="wmode" value="transparent"/></object>

4. SoundCloud
Sumber asal lagu adalah dari program ini sendiri. Gunakan link lagu yang ada di dalamnya saja. Adalah lebih baik terus ke laman webnya untuk dapatkan link dan kod untuk lagu-lagu.
Paparan skin MP3:

<iframe width="63%" height="110" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=link lagu dari soundcloud.com&amp;color=cc0000&amp;auto_play=false&amp;hide_related=true&amp;show_comments=false&amp;show_user=false&amp;show_reposts=false"></iframe>

5. MP3 Fusion
Sebenarnya kena register tapi yang ini pun aku tak ingat dapat kat mana...
Paparan skin MP3:

<embed src="http://www.mp3fusion.net/flash/mediaplayer.swf" width="300" height="100" allowscriptaccess="always" flashvars="height=100&amp;width=300&amp;file=link lagu.mp3&amp;screencolor=0xeeeeee&amp;showstop=true&amp;showdownload=false&amp;autostart=false&amp;skin=http://www.mp3fusion.net/flash/controlpanel.swf"></embed><div style='width:300px;background:transparent;font:14px Comic Sans MS;'>Tajuk Lagu</div>

2. Program tanpa lagu mp3 tapi sediakan skin mp3 player
Oleh kerana program-program ini tidak sediakan link lagu mp3, ada banyak pilihan skin mp3 player sama ada untuk satu atau lebih lagu.

1. FriendsBilly
Paparan skin MP3:

<center><embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=false&f0=http://link lagu.mp3&t0=Tajuk Lagu&total=1" quality="high" wmode="bbbbbb" width="300" height="20" name="" align="middle" type="application/x-shockwave-flash" ></embed></center>

Ini pula kod untuk lebih dari satu lagu:

<center><embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=false&f0=http://link lagu pertama.mp3&t0=Tajuk Lagu Pertama&f1=http://link lagu kedua.mp3&t1=Tajuk Lagu Kedua&f2=http://link lagu seterusnya.mp3&t2=Tajuk Lagu Seterusnya&total=3" quality="high" wmode="bbbbbb" width="300" height="20" name="" align="middle" type="application/x-shockwave-flash" ></embed></center>

2. MP3 Player
Ada lima jenis skin mp3 player. Kalau berminat; aku cadangkan pergilah ke laman webnya sebab boleh ejas ikut suka...
Paparan skin MP3:

<object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_multi.swf" width="300" height="22"> <param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_multi.swf" /> <param name="bgcolor" value="#ffffff" /> <param name="FlashVars" value="mp3=link lagu pertama.mp3%7Clink lagu kedua.mp3%7Clink lagu seterusnya.mp3&amp;width=300&amp;height=22&amp;volume=50&amp;autoplay=0&amp;loop=1&amp;shuffle=1&amp;showvolume=1&amp;showinfo=1&amp;volumeheight=10&amp;loadingcolor=ffffff&amp;bgcolor1=ffffff&amp;bgcolor2=dddddd&amp;slidercolor1=cc0000&amp;slidercolor2=cc0000&amp;sliderovercolor=bbbbbb&amp;buttoncolor=cc0000&amp;buttonovercolor=bbbbbb&amp;textcolor=666666&amp;showlist=0&amp;playlistcolor=999999&amp;currentmp3color=cc0000&amp;scrollbarcolor=cccccc&amp;scrollbarovercolor=bbbbbb" /> </object>

3. SCM Music Player
Ia terima link mp3, SoundCloud track dan link youtube. Kelemahannya – kedudukan skin mp3 player hanya di bahagian atas dan bawah; serta tak boleh ejas tinggi dan lebar skin.
Paparan skin MP3:

<script type="text/javascript" src="http://scmplayer.net/script.js" data-config="{'skin':'skins/tunes/skin.css (banyak lagi pilihan skin)','volume':50,'autoplay':true,'shuffle':false,'repeat':1,'placement':'top','showplaylist':false,'playlist':[{'title':'Tajuk Lagu Pertama','url':'link lagu pertama.mp3'},{'title':'Tajuk Lagu Kedua','url':'link lagu kedua.mp3'},{'title':'Tajuk Lagu Seterusnya','url':'link lagu seterusnya.mp3'}]}" ></script>

3. Bina sendiri skin mp3 player dalam blog

1. Guna html kod blog
Paparan skin MP3:

<br/><br/><video controls autoplay (buang perkataan ini jika tidak mahu autoplay) name="media" width="300" height="0"><source src="link lagu pilihan.mp3" type="audio/mpeg" ></source></video><div style='width:300px;background:transparent;font:14px Comic Sans MS;'>Tajuk Lagu</div>

2. WordPress Plugin
Paparan skin MP3:

Errrrr hehe yang ini nak juga ke? Nanti-nantilah bila ada senang baru aku bagi ya

4. Cara dapatkan link mp3 dari YouTube guna ListenVid

1. Buka YouTube dan cari lagu. Ambil link yang di atas sekali. Di sini paparan link youtube ialah https://www.youtube.com/watch?v=ixxVDu1vLUw


2. Buka ListenVid dan paste link tadi untuk tukar kepada link mp3. Tekan butang Convert It!

3. Right click mouse di kotak Download dan klik pada Copy link address. Paste kat mana-mana WordPad atau Notepad. Untuk contoh tadi, link mp3nya ialah http://listenvid.com/index.php?output=yt/ixxVDu1vLUw/256~~256~~Send_Me_An_Angel_-_Scorpions_Instrumental_Cover_auf_Yamaha_Tyros_uuid-56c450cc01c75.mp3

Cukup panjang dah ni. Penat woo buat tutorial yang ini. Harap-harap meriahlah semula dunia blog. Memula ingat nak jadikan 4 cerita tapi aaaahhhhh ada aku kisah.....