Add a Teaser Frame to Embedded Flash Video

When you embed a Flash video onto your website using the code provided by Post Link, it just displays a black play button until someone clicks it. You can make this look more enticing for people to click by adding a teaser image. This image displays on top of the video until someone clicks to watch it.

Depending on what the video is, you can actually enhance the overall message. For example, if you are embedding a video that promotes Product A, you can make a teaser image that says “Want to learn about our NEW product A?”

It is important to know that the teaser frame should be sized to 320×240 (or of the same 4:3 ratio) in order for it to take up the full player frame. You CAN use a different aspect ratio, but it will fill in the extra space around the image with black; which doesn’t look as professional.

A teaser frame is simply another variable for the flash player to load. As a result, modifying the Flash embed code is extremely simple. The embed code below has been modified to add a teaser frame. The additional bit of code is in red and bolded. When using this on your website, make sure you use the full image URL so it will display properly.

<p id=’preview’>The player will show in this paragraph</p>
<script type=’text/javascript’ src=’http://www.vidmails.com/flash/flashplayer/swfobject.js’></script>
<script type=’text/javascript’>
var s1 = new SWFObject(‘http://www.vidmails.com/flash/flashplayer/player.swf’,'player’,’320′,’260′,’9′);
s1.addParam(‘allowfullscreen’,'true’);
s1.addParam(‘allowscriptaccess’,'always’);
s1.addParam(‘flashvars’,'file=http://66.230.195.113/videos/5b9c12fa2075c9690a5409435f6c811240c873c5.flv&image=http://www.mywebsite.com/images/my-teaser-frame.jpg‘);
s1.write(‘preview’);
</script>

.The “&image=” is specifying a variable called ‘image’ that points to your desired image location. Our Flash player is programmed so that if a variable ‘image’ does exist, it takes that location and makes it the teaser frame.

Now that you know how to add a teaser frame, go ahead and modify the code in any currently embedded Flash videos on your website(s). This will make it look 100 times better.