Thank you for your purchase
If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form. Thanks so much!
If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form. Thanks so much!
Copy the panzer folder to your project and include the jQuery library + the plugin files inside the <head> tag of your page.
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> <link href="panzer/panzer.list.css" rel="stylesheet" media="all" /> <script src="panzer/panzer.list.js" type="text/javascript"></script>
Use multiple HTML5 <audio> tags in your markup:
<audio controls preload="auto" autobuffer title="Preview1 title"> <source src="preview1.mp3" type="audio/mpeg" /> <source src="preview1.ogg" type="audio/ogg" /> </audio> <audio controls preload="auto" autobuffer title="Preview2 title"> <source src="preview2.mp3" type="audio/mpeg" /> <source src="preview2.ogg" type="audio/ogg" /> </audio>
Initialize the audio player when the document is ready or right after the <audio> tags:
$(function(){ $('audio').panzerlist(); });
Please refer to the examples for more details.
The plugin can be customized easily using the options below.
Option | Default | Description |
---|---|---|
layout | mini | Determines the size of the player: mini, big |
theme | dark | Determines the theme used for the player: dark, light, custom (need to add style to .panzerlist-custom and children) |
expanded | false | Determines wheater to expand the player at layout full width. Useful for responsive designs. |
title | - | Set a song title to be displayed before the playlist or album cover. |
cover | - | Set a cover image with album or artist (image path). If specified, hides the playlist. |
volume | 100 | Set initial volume for the audio player. |
show_prev_next | false | Show previous and next controls. |
show_list | true | Show list of files to be played. |
pause_others | true | Determines if the player should pause when other panzer player song is played. |
auto_start | false | Play first song when the player is loaded. |
auto_advance | true | Play next song when the current one ends. |
repeat_all | false | Play first song after the playlist ends - basically it repeats the playlist over and over again. auto_advance must be set in order for this setting to work. |
auto_numbering | false | Determines if the plugin auto numbers the playlist items. |
Make sure you check out the examples, too. |
You can destroy the panzer interface and revert back to the native players:
$('audio').panzerlist('destroy');
If your browser doesn't have JavaScript enabled, the plugin fallbacks to the HTML5 <audio> tag. If the browser doesn't support the HTML5 <audio> tag, then a download link will be available for the user to get the files and listen to them locally on his computer.
Once again, thank you so much for purchasing this plugin. As I said at the beginning, I'd be glad to help you if you have any questions relating to this plugin. No guarantees, but I'll do my best to assist.