|
2. Upload Pickle to your site.
Be sure to keep the directory structure in-tact.
Here is an example of what pickle should look like on your server:
3. Wire the Pickle javascript file.
Add a reference to pickle.js anywhere between the opening <HEAD> and closing </HEAD> tags on your web page.
<script src="/pickle/pickle.js" language="javascript" ></script> and this is really long too
4. Wire a skin.
Add a reference to a skin's StyleSheet file in the <HEAD> of your web page:
<link href="/pickle/skins/black_line/_stylesheet.css" rel="stylesheet" type="text/css">
5. Establish a player.
Establish a DIV with a "data-media" attribute anywhere between the opening <BODY> and closing </BODY> tags on your web page.
<div data-media="/pickle/test-audio.mp3"gt;</div>
Completed HTML Page Example
Here is an example of a full HTML page "all wired up":
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>My Pickle Test Page</title>
<script language="javascript" src="/path/to/pickle.js"></script>
<link href="/path/to/_stylesheet.css" rel="stylesheet" type="text/css">
</head>
<body>
<div data-media="/path/to/song.mp3"></div>
</body>
</html>
The lines in pink are required to establish a Pickle Player on a web page.
The URLs in green should be replaced with actual URLs to files on your server. We recommend using "absolute URLs" to all files associated with Pickle.
IMPORTANT NOTE: We highly recommend including the <!DOCTYPE html... line in your page in order to ensure Pickle renders properly across all browsers.
|
examples
Licensing
Download Examples
