Wednesday, December 12, 2012

Cara Play Music di HTML

Haiii, kali ini gue bakal ngasih tau bocoran dari koding HTML tentang gimana caranya bisa play lagu pake HTML. Awalnya sih gue tau kode ini dari tugas HTML gue, yang disuruh buat design web pake Adobe Dreamweaver. Kebetulan gue dapet tema tentang tangga lagu gitu deh.
Gue ngerjain tugas ini sekelompok, sama Bagus, Lioni, dan Vini.
Cuss langsung aja ke topiknya..

Codingnya kaya gini :
<audio controls="controls">
    <source src="URL MUSIC.ogg" />
    <source src="URL MUSIC.mp3" />
        <p>Maaf, browser Anda tidak mendukung untuk menjalankan music ini.
<br>Silahkan Anda gunakan browser lain.</br>
</p>
</audio>
Mari kita liat koding itu. Saat play music kita harus nyiapin lagunya dulu yang akan di putar. File itu berbentuk .MP3 dan .OGG. Biar dapet file .ogg kita bisa convert file .mp3 yang kita punya pake software tambahan, gue sih biasa pake Format Factory buat convert jenis file.
Yang merah itu kita masukin url music kita yang akan kita pake.

Koding ini kita simpen dalam satu file proyek yang kita buat. Kaya gini conttohnya, gunanya biar ga ribet dan rapih.


Nanti kita bakal dapetin hasilnya kaya gini di browser yang kita pake :


Koding ini sayangnya masih belum bisa jalan di IE 9 ke bawah, buat browser yang lain juga belum tau deh gue, soalnya gue belum nyoba browser lain kecuali ke-3 browser di atas. Sejauh ini, yang paling bagus buat play music HTML itu di IE, tampilannya lebih keren kedua itu di chrome, yang ketiga baru deh di mozila.

Kalo nanti kita dapetin tulisan kaya gini : "Maaf, browser Anda tidak mendukung untuk menjalankan music ini. Silahkan Anda gunakan browser lain."  
Jangan panik ya.. Woles aja woless, hehehe. Itu tandanya Browser yang kita pake ga support sama kodingnya. Soalnya koding yg dipake ini koding HTML5.
Okedehh... Sekian tutorial dari gue kali ini, semoga bermanfaat.