Embed Code

Place the following inside the <head></head> tags.

<script type="text/javascript" src="flowplayer/flowplayer-3.2.11.min.js"></script>
<script type="text/javascript" src="flowplayer/flowplayer.ipad-3.2.9.js"></script>

Insert the code below into the <body></body> tags.

<a
	 style="display:block;width:400px;height:330px;margin: 10px auto;"
	 id="player">
</a> 
<script>
	$f("player", "flowplayer/flowplayer-3.2.12.swf", {
		clip: {
			live: true,
			url: '',
			scaling: 'fit',
			provider: 'rtmp',
			ipadUrl: 'http://///playlist.m3u8'
		},  
		
		plugins: {
			rtmp: {
				url: "flowplayer/flowplayer.rtmp-3.2.10.swf",
				netConnectionUrl: 'rtmp://:80/'
			}
		}
	}).ipad();
</script>

Instructions

  1. Download the following packages from http://example.streamguys.com/flowplayer-downloads.html
  2. Upload the files to your web server. Be sure to maintain the directory structure outlined below:
    3. player.html
flowplayer/ (directory)
flowplayer/flowplayer-3.2.12.swf
flowplayer/flowplayer-3.2.11.min.js
flowplayer/flowplayer.rtmp-3.2.10.swf
flowplayer/flowplayer.ipad-3.2.9.js
flowplayer/flowplayer.controls-3.2.12.swf
  3. Copy the code provided above in to the and tag of your HTML file. Upload this edited HTML file to your web server.
  4. Test the page make sure it's doing what you want it to.

Need help?

Modify the Frame Size

You can modify the frame size of the player to best match the dimensions of your video by changing the height and width values on line 2. Below are some common dimensions for 4x3 and 16x9 aspect video.

16x9

IdealGood
1280 x 7201152 x 648
1024 x 576896 x 504
768 x 432640 x 360
512 x 288384 x 216
256 x 144128 x 72

4x3

IdealGood
640 x 480608 x 456
512 x 384480 x 360
384 x 288352 x 264
320 x 240288 x 216
256 x 192244 x 168
192 x 144160 x 120

Optimize Video Settings for Mobile Delivery

Implementing the following encoder settings will improve the likelihood of delivery to mobile devices, especially those connected to impacted cellular networks.

  1. Multi-bitrate delivery is strongly encouraged, as this will allow the device to play the most appropriate stream for the current network connections.
  2. To reach devices connected to impacted 3G cellular networks, consider offering a stream with a total bitrate 250kbps or lower. (ie. video at 216kbps; audio at 32kbps)
  3. Keyframe interval: Every 2 seconds.
  4. Frame size: The most efficient encoding occurs with height and width values from the Ideal column.