wanwu

Just got this from SE forum:

The width=100% parameter is not valid in the video shortcode. It must be a number, in pixels, or omitted entirely.

If it is omitted, then the code will use the $content_width global from the theme to define the width of the containing DIV.

For more info on Content Width, see here:

http://codex.ww.wp.xz.cn/Content_Width

http://wordpress.stackexchange.com/questions/121410/wordpress-core-responsive-video-not-working-with-shortcode/121480?noredirect=1#121480

Thanks for the reply.

Odd though – because with this CSS:

.videocontent {
width: 100%;
height: 100%;
max-width: 1024px;
margin: 0 auto;
}

And this HTML in my homepage.php:

<div class=”videocontent”>
<video id=”myvideo2″ style=”width:90%;height:100%;” controls=”controls”>
<source src=”http://localhost/dnp/stalker.webm&#8221; type=”video/webm”/>
</video>
</div>

This works fine. See http://www.deekwa.com/dnp – the top example.

But with:

.wp-video-shortcode {
max-width: 100%;
}

And this HTML:

<div class=”videocontent”>
<?php
echo do_shortcode(‘[video webm="http://localhost/dnp/stalker.webm" width=100%]‘);
?>
</div>

doesn’t work – i.e. doesn’t scale to full size of .videocontent div…

I looked into Firebug and could see that there was a mejs-container that was being produced as part of the HTML from the do_shortcode, which I think was causing issues. I have spent all day getting xdebug2.2.3 recompiled to work on OS X Mavericks so I will dig into mediaelement tomorrow by looking into the do_shortcode call.

The .wp-video-shortcode CSS *did* help it rescale but only below the 640px that it is being constrained to. And the video in the example is 720px – which again I don’t understand why calling the shortcode is putting it inside this container…

I really want to be able to add media into the core as it gives a much cleaner back-end interface <to> theme.

Frustrating that as you say this hasn’t be implemented properly.

Bottom example at http://www.deekwa.com/dnp is the result I am getting with the shortcode. Doesn’t scale to full size of div as you re-size the browser.

Have been more comments at SO:

http://stackoverflow.com/questions/19807778/wordpress-core-responsive-video-not-working-with-shortcode

P