baca juga : Menyisipkan audio/lagu di HTML
Bila kita bicara tentang musik itu tidak akan ada habisnya, semua di belahan dunia pasti sudah mengetahui apa itu musik, meski berbeda - beda jenis musik yang disukai dalam setiap orang. Tanpa kita sadari musik bisa salah satu sarana penghibur jiwa dikala kita yang sedang sedih, entah itu sedang senang. Dan juga bisa untuk sebagai obat dikala pikiran kita sedang stress yang disebabkan oleh beberapa faktor. Tidak percaya? Silakan dicoba yaa ^_^
Musik dahulu hanya bisa dinikmati dengan keping CD (Compact Disc) saja kini bisa dinikmati di hp - hp yang mempunyai fitur pemutar musik dan sekarang website yang biasa kita gunakan untuk browsing informasi - informasi ternyata bisa juga lho di pasang pemutar musik, jadi kegunaannya untuk hiburan saja, misal kan kita boring (baca : bosan) baca artikel bisa sambil sambil memutar lagu.
Akan sedikit berbeda bila kita cara memasang nya, sebab tutorial sekarang berbeda dengan tutorial - tutorial sebelumnya yang berfokus pada tag HTML saja. Karena yang akan dibutuhkan sekarang tidak hanya HTML saja katakan saja ada JS(JavaScript), XML, CSS serta file - file pelengkap lainnya. Tetapi mohon maaf mungkin ini tutorialnya agak sedikit melompat ya, sebab pada tutorial sebelumnya belum dijelaskan penjelasan dasar - dasar dari bahasa yang akan kita pakai sekarang. Mungkin di tutorial selanjutnya akan dibahas.
Screenshot
- Web Editor (notepad++, DW,dll)
- Web Browser (Mozilla firefox, Chrome, dll)
- Download dahulu perlengkapannya disini
- Ekstrak didalam folder dengan nama bebeas, misa saya buat namanya playlist
- Buat folder dengan nama mp3 didalam folder playlist dan masukan musik mp3 nya ke dalam fodler mp
- Ketikan sintax/kode dibagian paling bawah artikel ini ke web editor
- Simpan dengan nama index.html dan simpan di dalam folder playlist
- Sekarang buka playlist.xml dan ganti nama yang dilingkari dibawah ini sesuai dengan nama mp3 yang anda masukan ke folder mp3
- Buka file index.html
- Selesai
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>GW Player</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body id="dewbody">
<div id="content">
<div id="players">
<h2>Playlist</h2>
<object type="application/x-shockwave-flash" data="dewplayer-playlist.swf" width="240" height="200" id="dewplayer" name="dewplayer">
<param name="wmode" value="transparent" />
<param name="movie" value="dewplayer-playlist.swf" />
<param name="flashvars" value="showtime=true&autoreplay=true&xml=playlist.xml" />
</object>
</div> <!-- #players -->
</div> <!-- #content -->
</body>
</html>
Credit : Dewplayer
No comments:
Post a Comment