customize skin player (membuat player musik/video) di blog

customize skin player (membuat player musik/video)


Seperti dalam tulisan saya sebelumnya, cara menyematkan musik/video ke blog, sebenarnya kita bisa menempelkan (mengembed) langsung musik/video dari situs youtube, 4shared,dll, tetapi tentu kita ingin agar player yang ada di blog/situs kita tampil beda dan unik, mencirikan blog/situs kita. Nah, pada artikel kali ini yang kita bahas adalah tentang customize skin player (membuat player) baik untuk memutar file musik mp3 ataupun video di blog kita.

Pada prinsipnya sebuah pemutar musik/video player diri dari dua komponen, aplikasi pemutar dan file yang akan diputar.


kode (script) untuk membuat sebuah player


Berikut ini adalah contoh kode(script) untuk membuat sebuah player yang bisa dipasang di widget atau disisipkan pada postingan kita:
<embed src="link file aplikasi pemutar/player?file=link file musik/video yang akan diputar&image=sekedar tambahan jika kita ingin memunculkan gambar tertentu sebelum musik/video dijalankan" type="application/x-shockwave-flash”></embed>

Contoh penerapannya adalah sebagai berikut:
<embed src="https://googledrive.com/host/0B_kdAlprCvExRmJPMHp6R3B5MWc?file=http://dc636.4shared.com/img/4333387867/8ba7c96f/dlink__2Fdownload_2FkNqUl_5FwYce_3Ftsid_3D20140113-181040-d4161753/preview.flv&image=https://googledrive.com/host/0B_kdAlprCvExdnB1aTJrWVpkTU0/" width="260" height="210" allowfullscreen="true" autostart="false" allowscriptaccess="always" type="application/x-shockwave-flash">
</embed>

Keterangan:


  • Link src=https://googledrive.com/host/0B_kdAlprCvExRmJPMHp6R3B5MWc ini adalah alamat dimana aplikasi pemutarnya disimpan, dalam hal ini aplikasi yang saya pakai adalah shockwave-flash (jwplayer) yang saya simpan dialamat tersebut (di drive.google.com), anda bisa langsung menggunakannya atau anda bisa juga mendownloadnya (pada alamat tersebut) dan menguploadnya di situs lain atau pada hosting anda.
  • Hosting Gratis
  • File=http://dc636.4shared.com/img/4333387867/8ba7c96f/dlink__2Fdownload_2FkNqUl_5FwYce_3Ftsid_3D20140113-181040-d4161753/preview.flv adalah file musik/video yang akan diputar. (dalam hal ini yang saya gunakan sebagai contoh adalah file video yang pernah saya upload ke 4shared)
  • Image=https://googledrive.com/host/0B_kdAlprCvExdnB1aTJrWVpkTU0/ adalah gambar statis (background pembuka) yang ingin kita munculkan sebelum di-play, (file ini juga saya simpan di drivenya google, silahkan anda ganti atau buat sendiri dengan logo blog/situs anda atau gambar apa saja yang sudah anda upload). Berikut ini contoh image yang saya pakai:



screenshot skin mp3 - video player

  • Kode berikutnya yang berwarna hijau hanya tambahan untuk pengaturan tampilan.
  • untuk melihat hasilnya, silahkan teman-teman Play Demo video dibawah ini:




Demikian sedikit artikel tutorial blog: cara membuat player musik (video) di blog, semoga bermanfaat.


Tidak ada komentar :