Flowplayer installation

This page helps you to put Flowplayer up and running. You may want to download Flowplayer before reading these instructions because the downloaded zip file contains a working example (examples/simple-example.html) that follows these instructions.

Quick Start

Every time you insert Flash objects into your pages you'll need some help from JavaScript to make it happen smoothly on different browsers.

Flashembed is a general purpose Flash embedding script developed by folks here at Flowplayer. It is the easiest tool to insert Flash on your pages in cases where you have to supply complex JSON configurations to your Flash object. All examples in this site use this tool.

If you really have to use SWFObject go here.

Minimal setup

<!-- include flashembed. make sure that it exists -->
<script src="flashembed.js"></script>

<!-- this DIV is where your Flowplayer will be placed. it can be anywhere -->
<div id="example"></div>

<script>
// place Flowplayer to our DIV
flashembed("example", "FlowPlayerLight.swf", {config: {
		
	// Flowplayer configuration as comma separated list  
	videoFile: 'example.flv',
	initialScale: 'scale'
	
}});
</script>

That's it. Just make sure that your file paths are correct. This will play example.flv video file using FlowPlayerLight.swf as the player.

flashembed arguments

1. id for the HTML element that is to be replaced with a Flash object
2. path to the flash object. this argument can also be given as object with multiple Flash parameters. full list of those parameters is given here.
3. Flowplayer specific configuration full list of options is given here

For experienced JavaScript users we recommend you to study various possibilities that flashembed.js script offers such as handling browsers that do not support Flash.

Setup with swfobject.js

SWFObject is very common library for inserting Flash on web pages. It is used very much an you may even have it already. Consider reading this document for more detailed information about using this library. Here are the steps.

1. Include swfobject.js JavaScript into your page

You can download latest version of the js file here.

  <script type="text/javascript" src="swfobject.js"></script>

2. Insert a placeholder for your video.

An unique ID must be supplied for the element.

  <div id="playerContainer"></div>

3. Write JavaScript that places your video into that placeholder

  var fo = new SWFObject(
    "FlowPlayerLight.swf", "FlowPlayer", "400", "250", "9", "#fff", true
  );
  fo.addVariable("config", "{videoFile: 'honda.flv'}");
  fo.write("playerContainer");

This script must be placed after the placeholder or it must be evaluated after the page loads.