Setelah ada pertanyaan dari beberapa blogger yang menanyakan cara memasang Audio Player di WordPress, maka saya bermaksud untuk sedikit menjelaskan langkah-langkahnya.
Kode dasar (default) dalam menampilkan Audio Player adalah seperti ini:
Sebagai contoh, jika ingin menampilan kajian => http://statics.ilmoe.com/kajian/users/solo/Rizky-AlMagetaniy/Kajian-Rutin-UNS/Al-Ustadz-Ayip-Syafruddin/Al_Ustadz_Ayip_Syafruddin-Syarah_Tsalatsatul_Ushul_012.mp3
maka kodenya seperti berikut,
dan tampilannya menjadi seperti ini,
Kemudian ada beberapa variasi yang dapat ditambahkan semisal warna latar belakang, warna tulisan, warna slider, dan lain-lain. Penjelasannya kurang lebih sebagai berikut:
0: |skip=0xHEX
1: |leftbg=0xHEX
2: |lefticon=0xHEX
3: |bg=xHEX
4: |righticon=0xHEX
5: |rightbg=0xHEX
6: |text=0xHEX
7: |slider=0xHEX
8: |loader=0xHEX
9: |track=0xHEX
10: |border=0xHEX
11: |bgcolor=#HEX [← tergantung warna background blog yang anda miliki]
12: |volslider=0xHEX
13: |voltrack=0xHEX
Saat dijalankan:
14: |righticonhover = 0xHEX
15: |rightbghover = 0xHEX
Saat saya menulis kata “HEX“, maka Anda menyisipkan nomor hex untuk warna yang diinginkan, untuk menemukan warna/angka, Anda dapat mencarinya semisal DISINI atau yang lainnya.
No.11 harus diubah jika background teks tidak putih dalam tema yang Anda gunakan, jika anda kebingungan mencari kode background blog yang anda pakai. Saya sarankan memakai kode seperti berikut agar tidak kelihatan warna backgroundnya:
|animation=no [←audio player selalu dalam tampilan terbuka]
Saran saya, tidak perlu anda untuk menampilkan seluruh kode yang telah saya sebutkan, cukup beberapa saja yang kiranya penting karena bisa jadi jika salah memilih warna atau terlalu banyak kode yang anda pakai maka tampilannya jadi kurang bagus atau anda sendiri menjadi kebingungan.
Opsi Tambahan
Ada beberapa opsi selain warna yang bisa ditambahkan semisal, Judul, nama pemateri, lebar audio player, dan selainnya.
|titles=Masukkan Judul
|artists=Masukkan Nama Pemateri
|animation=no [←audio player selalu dalam tampilan terbuka]
|width=Masukkan angka lebar; lebar defaultnya adalah 290
Dan ini contoh audio player yang saya buat:
Kodenya seperti berikut:
Selesai, semoga bermanfaat.
Sumber: http://catatanmaya93.wordpress.com/2012/06/30/cara-membuat-audio-player-di-wordpress-gratis/
Untuk memudahkan pembaca yang ingin langsung memasang Audio Player sesuai tampilan di atas, berikut contoh scriptnya:
["audio" statics.ilmoe.com/kajian/users/bandung/File-Titipan/Murottal-Ustadz-Abu-Syakir-Syuhada/Murottal-Al-Mursalat-Oleh-Al-Ustadz-Abu-Syakir-Syuhada.mp3|width=280|bg=0xCDDFF3|leftbg=0x357DCE|lefticon=0xF2F2F2|rightbg=0xF06A51|
rightbghover=0xAF2910|righticon=0xF2F2F2|righticonhover=0xFFFFFF|
text=0x357DCE|slider=0x357DCE|track=0xFFFFFF|border=0xFFFFFF|loader=0xAF2910|
titles=Murattal-al mursalat|artists=ustadz abu syakir syuhada|animation=no]
Jika tampilannya ingin seperti Audio Player yang telah saya modifikasi, berikut contoh scriptnya:
["audio" http://statics3.ilm0e.com/file/2013/03/07/rizkytulus.wordpress.com/ustadz-muhammad-as-sewed-persatuan-gombal.mp3|width=280|bg=0xCDDFF3|leftbg=0x357DCE|lefticon=0xF2F2F2|rightbg=0x3CB371|
rightbghover=0xAF2910|righticon=0xF2F2F2|righticonhover=0xFFFFFF|
text=0x357DCE|slider=0xE6E6FA|track=0xFFFFFF|border=0xFFFFFF|loader=0xDDA0DD|
titles=Persatuan Gombal|artists=ustadz muhammad umar as-sewed|animation=no]
Ket:
- Masuk ke Dasbor blog wordpress -> Tulisan -> Tambah Baru -> Copy Paste script yang dipilih pada menu visual
- Jangan lupa Menghapus Tanda Petik (“) pada kata audio
- Ubah yang dicetak tebal sesuai dengan alamat, judul dan pemateri kajian
salam
