Flowplayer 101


So I know that I have been MAJORLY slacking on this blog and for that I sincerely apologize, BUT.. I have really been hard at work on a number of aspects to the project @ hand.   Although the code listed below doesn’t seem to work as I would like in WordPress, I can none-the-less make it work as a stand-alone page… So something I have in a VHost config may be hosing this on my local WordPress test site… The code def works.  Anyway.. you guessed it, this is the minimal Flowplayer config, well a bit enhanced with some formatting and a splash image embedded in the player, but pretty basic otherwise.  I will also include the Yahoo! and Google embedded .mp3 players, but they are pretty straight forward and really need no explanation.

"Splash" screen

<html><head>
<meta http-equiv=”content-type” content=”text/html; charset=UTF-8″>
<!– A minimal Flowplayer setup to get you started –>
<script type=”text/javascript” src=”flowplayer-3.1.4.min.js”></script>

<!– some minimal styling, can be removed –>
<link rel=”stylesheet” type=”text/css” href=”style.css”>

<!– page title –>
<title>Flowplayer</title>
</head><body>

<div id=”page”>

<!– this A tag is where your Flowplayer will be placed. it can be anywhere –>
<a
href=”http://problog/video/GCCompany_Video.mp4&#8243;
style=”display:block;width:520px;height:330px”
id=”player”>
<!– specify a splash image inside the container –>
<img src=”../../img/Garot.png” border=”0″ vspace=”122″ align=”center” width=”200″ height=”80″ alt=”Search engine friendly content” />
</a>

<!– this will install flowplayer inside previous A- tag. –>
<script>
flowplayer(“player”, “../flowplayer-3.1.5.swf”);
</script>

</div>

</body></html>
<img src=”http://static.flowplayer.org/img/home/logo-3.1.jpg”/&gt;

Embedded Video Player

Here is the Yahoo! player

<img src=”http://l.yimg.com/a/i/ww/met/yahoo_logo_us_061509.png”/&gt;

<a href=”music/Kaskade-MoveForMe_Deadmau5.mp3″>Kaskade/Deadmau5 – Move 4 Me</a>
<a href=”music/Kaskade-IRemember.mp3″>Kaskade/Deadmau5 – I Remember</a>
<a href=”music/Deadmau5_Where_Is_Here.mp3″>Deadmau5 – Where Is Here</a>
<a href=”music/Deadmau5_Arguru.mp3″>Deadmau5 – Arguru</a>
<script type=”text/javascript” src=”http://mediaplayer.yahoo.com/js”></script></body&gt;

I’ll get the screenshots up in a few… bare-with-me 🙂

Yahoo! Player

Here is the Google plaer code.  This is a sharp looking player but only plays 1 file per instance… Somewhat limiting.  You can see it in the top left.

<!– embedded Google .mp3 player –>
<div id=”player”>

<h1><embed type=”application/x-shockwave-flash” src=”http://www.google.com/reader/ui/3247397568-audio-player.swf?audioUrl=music/Kaskade-MoveForMe_Deadmau5.mp3&#8243; width=”400″ height=”27″ allowscriptaccess=”never” quality=”best” bgcolor=”#ffffff” wmode=”window” flashvars=”playerMode=embedded” /></h1>

<!– –>

Advertisements

, , , , , , , ,

  1. Leave a comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: