Page address:

Audio player

The player embeds an MP3 file into a webpage using the Adobe Flash Player browser plug-in. When the play button is clicked the player downloads and plays an MP3 file. A direct link to the MP3 file is provided alongside the Flash-based player. This allows listeners to download the file and play it outside of the browser.

Sample MP3 file (broken link)

Embedding the audio player into a template page

Insert the following code into any template page. Change the title and link (in orange) as required. The link to the file must be a root-relative path.

<?php audio("Title of podcast", "/path/to/your/mp3file.mp3"); ?>

Video player

The video player embeds videos into a webpage. An example of a page that uses the video player is the Meet Our Donors page.

Video file requirements

  • The dimensions of the video must be either 640px by 360px (16:9) or 480px by 360px (4:3).
  • The video must be encoded as H.264 (MP4 or M4V) or Flash Video (FLV) for Flash. H.264 is currently preferred for this type of use.
  • If the video file is encoded with H.264 it should be "web-optimized," which allows a user to start watching a video when it is partially downloaded. Encoding H.264 video width Handbrake is a good guide for creating web optimized video using free software that is available for multiple platforms.
  • For recommended bitrate settings, try the Optimal Bitrate Calculator for Flash Video Encoding.
  • An optional image, called a poster image, which is typically a frame from the video, can be displayed in the page before the video is started. This image must be the same dimensions as the video. If no image is used, the user will see a black rectangle with a play icon over it.

Embedding the video player into a template page

Insert the following code into a template page and change the links (in orange) as required. The first link is the video file you are using. The second link is the poster image, which is optional. The links must be root-relative.

With a poster image:

<?php video("/path/to/video.mp4", "/path/to/poster.jpg");?>

Without a poster image:

<?php video("/path/to/video.mp4");?>