Version 2.10.3

Hi,
I just downloaded the plugin on a page that is being developed … the plugin was working and I said this has been one that I was l have been looking since I began using WP (some five years). This I got a message that that is an update and updated to the latest version expecting even more functionality. However the update dashed my hope and put me back to where I have been a few days back – it failed to work. I would appreciate if any one out there can help.

I followed the above comment but no where I find background code on line 147 of that .css file. I would appreciate if you bjlatta post here the code in that block so that I can identify it easily.

thanks for the developer of this wonderful piece of plugin. Thank you.

(oops, wrong topic. Sorry)

@bjlatta

The control graphics are now being served as svg files instead of png files. There appears to be a fallback in the case that the browser does not support svgs.

I had the same problem you are having. I suspect that you are not using svg images elsewhere on your site. You probably need to add some code to your htaccess file so that your server is sending the correct MIME type to your browser.

Add the following to an htaccess file in the root directory of your WordPress install.

AddType image/svg+xml svg

Give it a few minutes, and refresh your browser holding down shift to bypass the cache.

There is also a file missing from this plugin. The new svg version of the big play buttons is not included, but is referenced in the css file. I believe this is only used for video playback.

bigplay.svg is missing.

Upgrading to this version caused a regression where the player displays both the flash and non-flash version simultaneously for mp3 audio. The recommended fix from a previous thread where this was happening — ensure that the file type is used in the shortcode for the source file link — does not solve the problem with this version.

@ilowelife

What browser/OS is producing this problem? What version of WordPress? I’ve not tried it in Windows yet (and therefore not with IE), but this problem does not happen for me on a Mac with FireFox, Chrome, or Safari. I’ve tried several permutations of the shortcode, including:
src=music.mp3
mp3=music.mp3
and
mp3=music.mp3 ogg=music.ogg

I’ve also tried it with and without a width= parameter for the sortcode.

I’ve tried it as a shortcode in page content (from the WP page content editor), as well as in a template file using do_shortcode();.

I’m using this plugin on multiple sites with no problems. All sites are running the newest versions of WordPress and the mediaelement.js plugin.

Interesting.

Yesterday, pre-plugin update, I had a very simple shortcode implementation:

[audio mp3="/wp-content/uploads/02-Ave-Maria.mp3"]

This worked fine in Chrome/FF/Safari Mac.

When I updated the plugin, those browsers began displaying the double version of the player.

I didn’t test in IE yet either.

I reverted back to the previous version and it’s all fine again.

I saw this double version today when upgrading.

In my case the shortcode output was having wpautop() run on it for some reason. This means a load of extra <p> tags inserted all over the place. Not sure if this is down to a change in mejs or WP.
Try doing View Source or similar and see what your looks like. If you find some <p> tags within the mejs code then feel free to try my fix (back up first, I accept no liability, here be dragons etc…):

Edit mediaelement-js-wp.php to change (starting line 427):
$mediahtml .= <<<_end_
<{$tagName} id="wp_mep_{$mediaElementPlayerIndex}" {$src_attribute} {$type_attribute} {$width_attribute} {$height_attribute} {$poster_attribute} controls="controls" {$preload_attribute} {$autoplay_attribute} $video_skin_attribute>
{$mp4_source}
{$mp3_source}
{$webm_source}
{$flv_source}
{$wmv_source}
{$ogg_source}
{$captions_source}
<object width="{$width}" height="{$height}" type="application/x-shockwave-flash" data="{$dir}flashmediaelement.swf">
<param name="movie" value="{$dir}flashmediaelement.swf" />
<param name="flashvars" value="controls=true&file={$flash_src}" />
</object>
</{$tagName}>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_$mediaElementPlayerIndex').mediaelementplayer({
m:1
{$loop_option}
{$controls_option}
{$audio_size}
});
});
</script>


to

$mediahtml .= <<<_end_
<{$tagName} id="wp_mep_{$mediaElementPlayerIndex}" {$src_attribute} {$type_attribute} {$width_attribute} {$height_attribute} {$poster_attribute} controls="controls" {$preload_attribute} {$autoplay_attribute} $video_skin_attribute>
{$mp4_source}{$mp3_source}{$webm_source}{$flv_source}{$wmv_source}{$ogg_source}{$captions_source}
<object width="{$width}" height="{$height}" type="application/x-shockwave-flash" data="{$dir}flashmediaelement.swf">
<param name="movie" value="{$dir}flashmediaelement.swf" />
<param name="flashvars" value="controls=true&file={$flash_src}" />
</object>
</{$tagName}>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_$mediaElementPlayerIndex').mediaelementplayer({m:1{$loop_option}{$controls_option}{$audio_size}});
});
</script>

notice I removed a load of line-breaks and tabs. This solved it for me.