Posted by: Hartoto | 03/24/2016

Atasi Display File MP3 Pada Moodle Yang Terlalu Kecil

Bagi pengguna moodle 2.6 ke atas tentu akan mengalami masalah serupa dimana file mp3 yang di attach tampilannya sangat kecil (sekitar 15px tingginya). Ini meneurut saya tidak dapat dibaca dengan baik oleh user. Maka ukuran displaynya perlu ditingkatkan. Ada 3 lokasi file untuk melakukan custom display mp3 file pada Moodle.

1.theme /theme/base/style/core.css (baris 1221 – 1228, ubah height:30px & width:600px)

/* Audio player size in ‘block’ mode (can only change width, height is hardcoded in JS) */
.resourcecontent .mediaplugin_mp3 object {height:30px; width: 600px}
.resourcecontent audio.mediaplugin_html5audio {width: 600px}

/** Large resource images should avoid hidden overflow **/
.resourceimage {max-width: 100%;}

/* Audio player size in ‘inline’ mode (can only change width, as above) */
.mediaplugin_mp3 object {height:30px;width:600px}
audio.mediaplugin_html5audio {width: 600px}

moodle1

2. /filter/mediaplugin/styles.css (pada baris 6)

.mediaplugin.mediaplugin_mp3 object {display:inline;height:30px;width:600px;margin-left:0.5em;}

moodle2

3. /lib/javascript-static.js

for(i=0; i<M.util.audio_players.length; i++) {
var audio = M.util.audio_players[i];
if (audio.small) {
controls.controlall = false;
controls.height = 30;
controls.time = false;
} else {
controls.controlall = true;
controls.height = 30;
controls.time = true;
}

moodle3

Setelah itu jangan lupa purge cache melalui menu Site administration > Development> Purge all caches atau via url /admin/purgecaches.php

moodle4

Setelah itu bisa dilihat hasilnya

sebelum/default: Tombol sangat kecil, di play pun susah

mp3 moodle sebelumSesudah di edit CSS : Lebig besar dan terbaca

mp3 moodle sesudah

 


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Categories

%d bloggers like this: