About Web Development by Activo » WYSIWYG http://www.activoinc.com/blog Web Development in a Web 2.0 World Wed, 24 Nov 2010 00:25:02 +0000 http://wordpress.org/?v=2.8.4 en hourly 1 Embedding Videos in Ektron http://www.activoinc.com/blog/2009/07/02/embedding-videos-in-ektron/ http://www.activoinc.com/blog/2009/07/02/embedding-videos-in-ektron/#comments Thu, 02 Jul 2009 17:36:16 +0000 Ron Peled http://www.activoinc.com/blog/?p=244 video_icon_fullAlmost every other day what seems to be a simple task will reveal itself as a mini project. Perhaps a side-effect of the paste of which things change in the web development world. This is exactly what happened when I tried to embed a movie from backlight.tv in to an Ektron site. It did not work and the issue was not trivial.

This is the code that needed to be embedded into the body of the page which will trigger a flash player and stream a flash movie in to the browser:

<object class="cantaloupe_video" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0"
width="480" height="294" id="backlight_player" align="middle">
<param name="allowScriptAccess" value="always" />
<param name="allowFullScreen" value="true" />
<param name="movie" value="http://player.backlight.tv/player/?video_code=VDF2upIPH8s6239EQ90L" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="flashvars" value="" />
<embed src="http://player.backlight.tv/player/?video_code=VDF2upIPH8s6239EQ90L" flashvars="" quality="high" bgcolor="#000000" width="480" height="294" name="backlight_player" align="middle" allowScriptAccess="always" allowFullScreen="true" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>

Well, after I open a new content block and paste this code in the richtextarea/html input field and publish it, no video is displayed on the front page. After various debugging sessions I discovered that Ektron automatically strips out the <embed> tag. This is done probably because Ektron is trying to produce valid XHTML/HTML code and the embed tag is not.

How do we overcome the issue? We really have two options:

  1. Force Ektron’s new WYSIWYG editor to accept the invalid code and display it with the embed tag (not recommended, will not be covered here).
  2. Find a better way to embed the video with valid code.

While option one is not recommended and I’ll not cover it here, option two is quite easy and clean. To produce clean code use the following few lines of HTML instead, you can edit the original video code manually in an editor and then insert it into the content block:

<object type="application/x-shockwave-flash" style="width:454px; height:278px;"
data="http://player.backlight.tv/player/?video_code=VDF2upIPH8s6239EQ90L">
<param name="movie" value="http://player.backlight.tv/player/?video_code=VDF2upIPH8s6239EQ90L" />
<param name="wmode" value="transparent" />
</object>

What you need to focus on in the object tag which includes the width and height in the style element and the data element which includes the URL to the movie itself. Only one parameter is really required here: ‘movie’ which has the same URL to the actual movie. Everything else is not required and may not be necessary.

So, after cleaning up the original code, I inserted this new one into the content block, published it and vuala! it worked.

Thanks to Jeff Martinez for pointing it out on the Ektron Fourms.

Most Commected Posts

]]> http://www.activoinc.com/blog/2009/07/02/embedding-videos-in-ektron/feed/ 2