FAQ

Hope you have already purchased “HTML5 MP3 Radio FM Stream” from here http://html5plus.svnlabs.com/shop/html5-mp3-radio-fm-stream/

Check Radio Demo here… http://html5plus.svnlabs.com/shop/html5-mp3-radio-fm-stream/

There is a difference between versions of shoutcast. 1.9.9 doesn’t support HTML5 Audio where 1.9.8 is compatible with HTML5 Audio

Please check our FAQ Section for more help…
Shoutcast Stream is not working?

Hello,

You can find style files here… We are using images for backgrounds

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/css/player.css in this CSS you can find image “../images/player-bg.jpg” .. that is black .. you can replace with new image

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/images/player-bg.jpg

And same for big player

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/css/player_big.css .. image background

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/images/player-big-bg.jpg
http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/images/player-bg-small.jpg

You can change color of these image to your requirements in paid version of HTML5 MP3 Player 😉

Thanks

Hello,

We have variety of players

https://www.svnlabs.com/html5/

– Small HTML5 MP3 Player
– Horizontal / Vertical HTML5 MP3 Player
– Footer Stick Player
– Karaoke Player
– Pay Per Video Player

Please select your choice … we can provide plugin for – Joomla / WordPress 🙂

Thanks

Now plugin users can create dynamic playlist using new plugin addon…

Addon need MP3 Folder link to read all mp3 files in any folder publicly accessed

Example: https://www.svnlabs.com/mp3/ https://www.svnlabs.com/songs/

HTML5 MP3 Player with Playlist addon can read private folders using PHP on same server

Read more about this addon

Customization is not possible for free version 🙁

You need to purchase code for HTML5 MP3 Player

You can add us on skype: svnlabs for more help

We are developers of HTML5 MP3 Player

We will be happy to assist you 🙂

Tabbed playlists in single player is possible

We have 3 options in HTML5 MP3 Player with rectangle cover image

Horizontal Playlist – 566×207

Vertical Playlist – 347×414

No Playlist – 347×207

You can easily customize rectangle cover image to square cover image

You need to edit cover image size in PHP files

– html5full.php
– html5small.php
– html5big.php

Amazon S3 Bucket Region and there Website Endpoint

US Standard : s3-website-us-east-1.amazonaws.com
US West (Origon) Region : s3-website-us-west-2.amazonaws.com
US West (Northern California) : s3-website-us-west-1.amazonaws.com
EU (Ireland) : s3-website-eu-west-1.amazonaws.com
Singapore ( Asia Pacific ) : s3-website-ap-southeast-1.amazonaws.com
Tokyo ( Asia Pacific ) : s3-website-ap-northeast-1.amazonaws.com
South America (Sao Paulo) Region : s3-website-sa-east-1.amazonaws.com

“Servers should be limit on URI lengths above 255 bytes because some older client or proxy implementations may not properly support these lengths.”

Different browser agents support different URI length acceptance. In addition, servers too play a role in accepting/denying URI’s over certain length which may either truncate the URI or may give lengthy URI message indications.

WordPress and Standalone HTML5 MP3 Radio FM Stream Plugin compatible with iOS, Android and supports all browsers Firefox, Chrome, Safari, IE and Opera!

HTML5 MP3 Radio FM MP3 Stream Player can grab “Now Playing Song Information” on player as StreamTitle for Shoutcast and Icecast Streams.

HTML5 MP3 Radio Icecast Stream player and have got the stream to play but I get this error…

“Fatal error: Call to undefined function parse_ini_string() in
/public_html/wp-content/plugins/shoutcast-icecast-html5-radio-player/html5/icecast.php on line 51”

Solution:

Comment the if conditions for function parse_ini_string( $string ) 😉

///if( !function_exists(‘parse_ini_string’) ){

///}

You can figure out why the mp3’s were not playing in Chrome. The ID3 information was too long and then Chrome doesn’t recognize it as an mp3 file. You were mixing down the sets in Adobe Audition and it was adding tags and markers into the ID3.

Chrome must read ID3 information and the other browsers don’t do that yet at this point…..

You can find block of code in core files in html5 folder

– html5full.php
– html5small.php
– html5big.php

You need to remove …..

<a href=”https://twitter.com/intent/tweet?status=<?php echo “HTML5 MP3 Player with Playlist “; ?><?php echo urlencode(‘https://www.svnlabs.com/html5’); ?>&amp;url=<?php echo urlencode(‘https://www.svnlabs.com/html5’); ?>” target=”_blank” title=”Twitter”><img src=”twitter.png” border=”0″ width=”20″ /></a><a href=”https://www.facebook.com/sharer/sharer.php?u=<?php echo urlencode(‘https://www.svnlabs.com/html5’); ?>” target=”_blank” title=”Facebook”><img src=”facebook.png” border=”0″ width=”20″ /></a><a href=”https://www.svnlabs.com/html5″ target=”_blank” title=”HTML5 MP3 Player with Playlist”><img src=”link-icon.png” border=”0″ width=”20″ /></a>

OR

<a href=”https://www.svnlabs.com/html5″ target=”_blank” title=”HTML5 MP3 Player with Playlist”><img src=”link-icon.png” border=”0″ width=”20″ /></a>

– Remote file read file_get_contents()
– XML functions simplexml_load_string()
– File functions fopen(), fread(), fclose()
– php mysql function

List of php.ini directives

Description of core php.ini directives

W3C will throw error for iframes, so you need to use object tags in place of iframe tags.

<?php

if($matches[1][0]==”full”)
{
$replace = ‘<object data=”https://www.svnlabs.com/html5/html5full.php?id=’.$matches[2][0].’&bg=f6f6f6″ type=”text/html” width=”606″ height=”230″ style=”border: medium none; background-color:#f6f6f6; overflow:hidden; width: 606px; height: 230px;”></object>’;
}
else if($matches[1][0]==”big”)
{
$replace = ‘<object data=”https://www.svnlabs.com/html5/html5big.php?id=’.$matches[2][0].’&bg=f6f6f6″ type=”text/html” width=”386″ height=”434″ style=”border: medium none; background-color:#f6f6f6; overflow:hidden; width: 386px; height: 434px;”></object>’;
}
else
{
$replace = ‘<object data=”https://www.svnlabs.com/html5/html5small.php?id=’.$matches[2][0].’&bg=f6f6f6″ type=”text/html” width=”386″ height=”230″ style=”border: medium none; background-color:#f6f6f6; overflow:hidden; width: 386px; height: 230px;”></object>’;
}

if($matches[1][0]==”full”)
{
$replace = ‘<iframe src=”https://www.svnlabs.com/html5/html5full.php?id=’.$matches[2][0].'” frameborder=”0″ marginheight=”0″ marginwidth=”0″ scrolling=”no” width=”566″ height=”207″></iframe>’;
}
else if($matches[1][0]==”big”)
{
$replace = ‘<iframe src=”https://www.svnlabs.com/html5/html5big.php?id=’.$matches[2][0].'” frameborder=”0″ marginheight=”0″ marginwidth=”0″ scrolling=”no” width=”347″ height=”414″></iframe>’;
}
else
{
$replace = ‘<iframe src=”https://www.svnlabs.com/html5/html5small.php?id=’.$matches[2][0].'” frameborder=”0″ marginheight=”0″ marginwidth=”0″ scrolling=”no” width=”347″ height=”207″></iframe>’;
}

?>

Instructions:

To Listen: Click on the Chapel you would like to listen then click the Play button. The audio files are large and depending on your connection may take a moment to load. Press pause then play if this happens.

To Download: Click the Download icon. It will popup a new web browser window. From there, choose File > Save As. Note that not all browsers may have this option.

Plugin Forums

RSS link for this plugin’s support threads.

Subscribe to Emails for this Plugin

Warning: trigger_error() expects parameter 2 to be long, string given in
/home/churc814/public_html/wp-content/plugins/amazon-s3-cloud-html5-mp3-player/s3/S3.php on line 222

Warning: Invalid argument supplied for foreach() in
/home/churc814/public_html//wp-content/plugins/amazon-s3-cloud-html5-mp3-player/html5/html5full.php on line 138

Solution:

Please make sure you have entered valid information (Key case and spaces) 🙂

Please double check Amazon S3 Bucket Endpoints in plugin setting’s page

Add your amazon information valid amazon key and valid (no spaces) amazon secret key. Then just add a bucket to your account add folders.

Make sure you have public permission for all your music in your S3 buckets and folders.

If HTML5 Player’s Javascripts and other resources are giving 404 error …

The problem with IIS7 Webserver on Windows is, that “Request filtering” doesn’t allow any files in directories, to be executed. As plugin contains a some inner directory, scripts in this directory won’t be executed (security reasons).

It works, if you remove the directory from the request filtering hidden segments in the IIS admin console. You might consider calling the directory different for the future – to avoid problems with IIS installations.

Copyrighted Music Publicly?

When you buy an audio file, software, or CD, even those specifically marketed for business purposes, the purchase price covers only your private listening use, regardless of how they are labeled. Once you decide to play any copyrighted music publicly, you need permission from the copyright owners……

Can I add copyrighted songs to the player?

Of course you can, unlike a common misconception, you are not “uploading” files to the player, you are letting the in-game player know where your music files are on your computer. No uploading of any music takes place, you can add any songs you want to your music player……

Music Sharing?

We know about legal music sharing and violating copyright by hosting MP3 files on our hosting server. We are providing HTML5 MP3 Music/Audio Player with Flash fallback to listen MP3 music to our customers/users. The customers are purchasing HTML5 MP3 Player with playlist not music.
We are not selling or hosting or uploading copyrighted or unlicensed music on our hosting server…….

HTML5 MP3 Players

Below you can find a nice article … How Metadata work for Radio Stream

PHP can parse song metadata from ICY streams including most of the streams on ShoutCast and IceCast.

1. Add “ICY Metadata: 1” to the HTTP GET headers.

// connect to server
$fp = fsockopen($host, $port, $errno, $errstr, 90);
if (!$fp) {
echo “$errstr ($errno)
\n”;
} else {
$out = “GET $path HTTP/1.0\r\n”;
$out .= “Icy-MetaData:1\r\n”;
$out .= “\r\n”;
fwrite($fp, $out);
}

2. Parse the icy-metaint from the HTTP response headers.

// check whether icy-metaint is present
if(!isset($headers[“icy-metaint”])) {
die(“icy-metaint not set”);
}

3. Begin the stream and get metadata information

The SHOUTcast/Icecast Radio Stream will return ICY 200 OK instead of HTTP 200 OK in its response.

Note: Please make sure with Radio Hosting Support … if icy-metaint is present in your Radio Stream

No Redirections in Radio Stream:

http://listen.domain.com/radiostream ==> http://streaming.domain.com/RadioStream?group=989

Note: Please make sure your Radio Stream don’t have any direction.

The autoplay option does not work on Apple iOS mobile devices (iPhone, iPad, iPod) because Apple specifically prohibits it. Basically, iOS devices requires actual user interaction (physical touch) to start play Audio / Video Players.

According to Apple documentation:

Controls are always supplied during fullscreen playback on iPhone and iPod touch, and the placeholder allows the user to initiate fullscreen playback. On the desktop or iPad, you must either include the controls attribute or provide playback controls using JavaScript. It is especially important to provide user controls on iPad because autoplay is disabled to prevent unsolicited cellular download.

In Safari on iOS (for all devices, including iPad), where the user may be on a cellular network and be charged per data unit, preload and autoplay are disabled. No data is loaded until the user initiates it. This means the JavaScript play() and load() methods are also inactive until the user initiates playback, unless the play() or load() method is triggered by user action. In other words, a user-initiated Play button works, but an onLoad=”play()” event does not.

iOS-Specific Considerations

Browser & format support
With Flash as a fallback, it should work pretty much anywhere.
It has been verified to work across:
– Mobile Safari (iOS 3+)
– Android (2.2+, w/Flash), Android (4.0+)
– Safari (4+)
– Chrome (7+)
– Firefox (3+, w/ Flash)
– Opera (10+, w/ Flash)
– IE (6, 7, 8, w/ Flash)

Some Time JavaScript & Flash player cause issue on Windows XP + IE8 … please make sure you have latest Flash Player and No JavaScript Errors on Player Page …

if (!Date.now) {
Date.now = function() { return new Date().getTime(); };
}

var currentTime = Date.now() || +new Date();

HTML5 MP3 Player uses native <audio> where available and an invisible flash player to emulate <audio> for other browsers. It provides a consistent html player UI to all browsers which can be styled used standard css.

Browser & format support
With Flash as a fallback, it should work pretty much anywhere.
It has been verified to work across:
– Mobile Safari (iOS 3+)
– Android (2.2+, w/Flash), Android (4.0+)
– Safari (4+)
– Chrome (7+)
– Firefox (3+, w/ Flash)
– Opera (10+, w/ Flash)
– IE (6, 7, 8, w/ Flash)

If Radio Stream don’t have valid Radio Stream Codec Info then some Shoutcast Icecast mp3’s won’t play in html5 audio player

Please make sure you are using Valid Format Codec Radio Stream in HTML5 Radio Players

Best Codec, Sample Rate, Bitrate and Channel for Radio Icecast / Shoutcast Streaming

Standard Working Stream Info
Type: Audio
Codec: MPEG Audio layer 1/2/3 (mpga)
Channels: Stereo
Sample rate: 44100 Hz
Bitrate: 128 kb/s

Note: Icecast/Shoutcast MP3/AAC Radio stream must be 44100hz & 128kb/s stereo to work perfectly in players.

Other Stream Info
Type: Audio
Codec: MPEG Audio layer 1/2/3 (mpga)
Channels: Mono
Sample rate: 11025 Hz
Bitrate: 16 kb/s

There is a og:url tag in Facebook Open Graph Tags. If you know the parent page URL of the embedded content, you can set og:url parameter with the parent page URL. Then, it behaves like the way you share the parent page.

Facebook Share

<meta property=”og:type” content=”article”/>
<meta property=”og:title” content=”TITLE”/>
<meta property=”og:url” content=”URL”/>
<meta property=”og:image” content=”IMAGE”/>
<meta property=”og:description” content=”DESCRIPTION…”/>
<meta property=”og:site_name” content=”WEBSITE”/>
<meta property=”fb:app_id” content=”FB_APP_ID”/>

Song information is Ajax based process that will run every 5 mins

This is only one way to get song’s information in HTML5 based players 🙂

We can reduce Ajax request time to get updated information every 1 or 2 mins

You can review other html5 products, I will be here if you need my plugin

https://www.svnlabs.com/html5/radio-fm-stream/

Please try unicode mp3 links in XML file

Like:

http://server.com/mp3/បើសិនអូនជាសង្សារបង.mp3 (MP3 from any server or domain)

or

http://ip-address/audio/បើសិនអូនជាសង្សារបង.mp3 (MP3 from any server using IP Address)

I have tested on WordPress 3.4.1.

Its working fine for me

http://blog.svnlabs.com/work/wordpress-3-4-1/

If you are checking here http://wordpress.org/extend/plugins/html5-mp3-player-with-playlist/installation/

Free plugin is old .. new one is compatible with WordPress 3.4.1.

http://blog.svnlabs.com/work/wordpress-3-4-1/

If you installed this player http://html5plus.svnlabs.com/shop/html5-mp3-radio-fm-stream/ but it’s consuming a tremendous amount of server resources:

Users on Share Web Host could not allow/open Radio Server port to web server firewall as outgoing port to read shoutcast / icecast current playing song information…

You can turn off song meta data, but if users want to see that. It is still possible to embed a separate ticker on the site to show this information 🙂

If your server can’t support for metadata …. and it taking too much CPU / Memory ..

You can subscribe to our API get all Metadata for Icecast / Shoutcast Servers its $5 / month
http://www.radioforge.com/icecast-shoutcast-metadata/

Paid Features…

1. Vertical (Big) playlist
2. Random/Shuffle mode in playlist
3. Download Option
4. Customize Twitter / Facebook links
5. Support iOS / Android
6. Stream MP3 HTTP Stream from Wowza, Cloudfront, CDN etc.
7. More customization available as you get full files hosted on your server 😉

https://www.svnlabs.com/html5/wordpress-plugins/

Using this addon two or more players can be added on the same page or post.

1. Both full players
2. Small and Full Players
3. Both Small Players
4. Big and Small Players
5. Full and Big Players
6. Both Big Players

https://www.svnlabs.com/html5/multiple-players-on-same-page-using-shortcode/

Please check below javascript file link to auto play playlist

https://www.svnlabs.com/html5/audiojs/audio.js

settings: {
autoplay: true,

You need to update audio.js file in “wp-content/plugins/html5-mp3-player-with-playlist/html5/audiojs/”

OR

Add below statement in player file html5small.php, html5full.php or html5big.php on body load function 😉

$(‘.playing’).click(); //for autoplay

Soundcloud provide playlists as Sets URL like: http://soundcloud.com/USER-NAME/sets/SET-NAME/

Make sure your Soundcloud Sets are PUBLIC to play in player

How to make SoundCloud Set PUBLIC??

You need to go to soundcloud page i.e. http://soundcloud.com/USER-NAME/sets/SET-NAME/edit

My SoundCloud PUBLIC set: https://soundcloud.com/svnlabs/sets/svnlabs

Please review … if you know HTML / CSS / PHP

https://www.svnlabs.com/html5/html5-mp3-player-with-downloadable-playlist-option/

For download option you need to edit files here…

wp-content/plugins/html5-mp3-player-with-playlist/html5/html5full.php

wp-content/plugins/html5-mp3-player-with-playlist/html5/html5big.php

Find:

<li>
<a href=”#” data-src=”<?php echo $mp3s; ?>” title=”<?php echo $mp3t; ?>” class=”track-name” name=”<?php echo $mp3p; ?>”><?php echo $mp3t; ?></a>
<p class=”Title01″><?php echo $mp3a; ?></p>
</li>

Add above it:

<span style=”right:27px; position:absolute;”>&nbsp;&nbsp;<a href=”<?php echo $mp3s; ?>” download=”MyDown” style=”z-index:1000; position:absolute;” target=”_blank” title=”Download”><img src=”download.jpg” border=”0″ width=”17″ /></a></span>

Its very easy…..

https://wordpress.org/plugins/shoutcast-icecast-html5-radio-player/

Just find iframe based code from WordPress admin plugin player setting page …. then make a html page “player.html” paste iframe embed code … use JavaScript to make popup using this new html page “player.html” 😉

<button onclick="myFunction()">Try it</button>  OR <a href="javascript:void(0);" onclick="myFunction()">Listen Live</a>

<script>
function myFunction() {
    window.open("http://domain.com/player.html", "_blank", "toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=400, height=400");
}
</script>

http://www.w3schools.com/jsref/met_win_open.asp

Is it possible to play shoutcast internet radio streams with html5?

Add semicolon after shoutcast link 😉
http://yourdomain:port/;

How could I play a shoutcast/icecast stream using HTML5?

<!DOCTYPE html>
<audio controls src=”http://domain.com:8010/;”></audio>

Yes, You can adjust audio volume to custom level using javascript

defaultValue: 8,

Set defaultValue to custom value …

We are using that JavaScript statement in function

Paid Version:

1. Vertical playlist https://www.svnlabs.com/html5/vertical-playlist/
2. You can take backup your xml files becoz file will be hosted on your server
3. We will assist on skype for paid support
4. Paid version have fully customize link, text, images etc. using HTML5 and CSS
5. Paid plugin also support WordPress 3.5
6. Random/Shuffle mode in playlist

Addon: https://www.svnlabs.com/html5/multiple-players-on-same-page-using-shortcode/

Icecast Streaming Media Server

fsockopen() [function.fsockopen]: unable to connect to icecast-ip-address:port (Connection refused)

IceCast Stream
http://icecast-ip-address:port/stream
http://icecast-ip-address:port/live

You must contact to your icecast hosting support for IP, Port, Domain blocking 😉

Make sure you have icecast port opened on HTML5 MP3 Plugin server 😉

Now plugin users can create dynamic playlist using new plugin addon…

Addon need MP3 Folder link to read all mp3 files in any folder publicly accessed

Example: https://www.svnlabs.com/mp3/ https://www.svnlabs.com/songs/

HTML5 MP3 Player with Playlist addon can read private folders using PHP on same server 😉

Other plugin

HTML5 MP3 Player with Playlist for Feedburner

<?php

$s = ‘http://www.domain.com/songs/4 THE SICK – 13 – Because Of U featuring Evan Eleazer.mp3’;

$s = str_replace(” “, “%20”, $s);

// OR

$s = preg_replace(‘/ /i’, ‘%20’, $s);

echo $s;

?>

Output: http://www.domain.com/songs/4%20THE%20SICK%20-%2013%20-%20Because%20Of%20U%20featuring%20Evan%20Eleazer.mp3

Is it possible to change the direction of the rolling text/song information in HTML5 Shoutcast / Icecast Radio Player? At the moment it’s going from left to right but we would like it to go into the other direction.

Yes, Please find files in wordpress plugin folder

– shoutcast-icecast-html5-radio-player/html5/html5shoutcast.php
– shoutcast-icecast-html5-radio-player/html5/html5icecast.php

Or

– html5-mp3-player-with-playlist/html5plus/html5full.php
– html5-mp3-player-with-playlist/html5plus/html5big.php
– html5-mp3-player-with-playlist/html5plus/html5small.php

then find tag <marquee …. and change direction=”right” to direction=”left”

HTML5 MP3 Player with Playlist can be used on different page and post using shortcodes: https://www.svnlabs.com/html5/shortcodes/

You need to create XML/RSS based playlist first

Small Player (No Playlist): [html5mp3small:ID]

Full Player (With Playlist): [html5mp3full:ID]

Here ID is identifier of playlist you created 😉

We have addon to read folder of mp3 files to create XML based playlist dynamically

HTML5 MP3 Player Folder Addon

Thanks

Paid version of HTML5 MP3 Player with Playlist have download feature in playlist.

You can customize MP3 downloads and can add buy now button near download link

https://www.svnlabs.com/html5/html5-mp3-player-with-downloadable-playlist-option/

We have another addon to customize color and size of HTML5 MP3 Player with Playlist that is CSS based.

HTML5 MP3 Playlist Player Custom Color Size

You can customize player to fit on your website using custome size and colors.

HTML5 MP3 Playlist Player Custom Color Size

HTML5 MP3 Playlist Player Custom Color Size Options

Sample Player

Question:

I need a quote for your players and I need to know the following:

The music will get intrupted if the page change in the same
website?
If yes, is it possible to stick it to all the pages and just keep
musics to play during the page change?
Is it able to add new songs from different pages by a click on
musics?
would you be interested to develop a player with more functionality?

Answer:

You need to use “Frames Website Template” for your page / website
http://blog.svnlabs.com/frames-website-template/

You can use any frame for HTML5 MP3 Player Plugin …

Question:

What I want to do is have 1 player on the page that can access multiple playlists that the end user can select from and play the applicable content. Is that possible?

Answer:

https://www.svnlabs.com/html5/faq/multiple-players-on-same-page-using-shortcode-addon/

Yes, We can create a new addon “Tabbed playlists in single player” for that 😉

The XML Playlist files for free version are hosted on https://www.svnlabs.com/html5/ in xml folder 😉
Like https://www.svnlabs.com/html5/xml/1347391361.xml ..

You will lose all XML files when you upgrade plugin from Free to Paid (Self Hosted) Version.
So, Please take backup for your old XML Playlist files from Free version.

You can download your old XML files hosted on server https://www.svnlabs.com/html5/ (If you know the name of XML files)

Using : https://www.svnlabs.com/html5/xml/XML-File-Name

Example: https://www.svnlabs.com/html5/xml/1347391361.xml

You can request us for lost XML Playlist Files if you know your playlist ID for Free Plugin 😉

Playlist ID : [html5mp3full:5259] or [html5mp3full:ID]

1. JS Widget

2. Color Scheme

3. Size Customization

4. Playlist Hide / Show

5. Player API

6. Download / Buy Now

Embed Code Button in HTML5 MP3 Player

Iframe based Embed code text area to copy code

Original Player

Re-sized Player

Use below code

<div style=”-moz-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -webkit-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -o-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -ms-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); clear:both; float:left;”><iframe src=”http://html5player.svnlabs.com/v1/html5full.html?id=276″ height=”227″ width=”586″ frameborder=”0″ marginwidth=”0″ marginheight=”0″ scrolling=”no”></iframe></div>

Div Style

style=”-moz-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -webkit-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -o-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -ms-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); clear:both; float:left;”

You can use suitable scale(.8) parameter to resize player on webpage 🙂
i.e. scale(.8), scale(.67), scale(.5) etc.

http://yourdomain.com/audiojs/audiojs.swf?playerInstance=audiojs.instances[%27audiojs0%27]&datetime=1382426114401.4087

Solution:

Just replace code (Original audio.js)

flashSource: ‘\
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ id=”$1″ width=”1″ height=”1″ name=”$1″ style=”position: absolute; left: -1px;”> \
<param name=”movie” value=”$2?playerInstance=’+audiojs+’.instances[\’$1\’]&datetime=$3″> \
<param name=”allowscriptaccess” value=”always”> \
<embed name=”$1″ src=”$2?playerInstance=’+audiojs+’.instances[\’$1\’]&datetime=$3″ width=”1″ height=”1″ allowscriptaccess=”always”> \
</object>’,

with

flashSource: ‘\
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ id=”$1″ width=”1″ height=”1″ name=”$1″ style=”position: absolute; left: -1px;”> \
<param name=”movie” value=”$2?playerInstance=’+audiojs+’.instances[&quot;$1&quot;]&datetime=$3″> \
<param name=”allowscriptaccess” value=”always”> \
<embed name=”$1″ src=”$2?playerInstance=’+audiojs+’.instances[&quot;$1&quot;]&datetime=$3″ width=”1″ height=”1″ allowscriptaccess=”always”> \
</object>’,

This is not permission (0755 or 0777) error of SWF file, Make sure you have valid characters on some browsers…

instances[\’$1\’] => instances[&quot;$1&quot;] 😉

HTML5 Video Player with Playlist have HTML5 video the element enable native video playback within the browser.  It supports all browsers i.e. iOS, Android, Firefox, Chrome, Safari, IE and Opera.

You can enable single html5 video without playlist using below code..

You need to remove 2 options in JavaScript

playlist: ‘<?php echo plugin_dir_url(__FILE__); ?>../xml/<?php echo $xml; ?>’,
vertical: <?php echo $playlistmod; ?>,

For single video JavaScript look like →

<script type=”text/javascript”>
jQuery(function() {
jQuery(“#html5player<?php echo $rnd; ?>”).html5player({
width: ‘<?php echo $width; ?>px’,
height: ‘<?php echo $height; ?>px’,
autoNext: <?php echo $autonext; ?>,
shuffle: <?php echo $shuffle; ?>,
loop: <?php echo $loop; ?>,
scrollMode: “hover<?php //echo $scrollmode; ?>”, //”auto”
logo: “<?php echo $logo; ?>” // logo.png
});
});
</script>

<video id=”html5player<?php echo $rnd; ?>” src=”VIDEO-LINK” poster=”VIDEO-IMAGE-LINK”></video>

Amazon S3 Bucket Region and there Website Endpoint

US Standard : s3-website-us-east-1.amazonaws.com
US West (Origon) Region : s3-website-us-west-2.amazonaws.com
US West (Northern California) : s3-website-us-west-1.amazonaws.com
EU (Ireland) : s3-website-eu-west-1.amazonaws.com
Singapore ( Asia Pacific ) : s3-website-ap-southeast-1.amazonaws.com
Tokyo ( Asia Pacific ) : s3-website-ap-northeast-1.amazonaws.com
South America (Sao Paulo) Region : s3-website-sa-east-1.amazonaws.com

“Servers should be limit on URI lengths above 255 bytes because some older client or proxy implementations may not properly support these lengths.”

Different browser agents support different URI length acceptance. In addition, servers too play a role in accepting/denying URI’s over certain length which may either truncate the URI or may give lengthy URI message indications.

If HTML5 Player’s Javascripts and other resources are giving 404 error …

The problem with IIS7 Webserver on Windows is, that “Request filtering” doesn’t allow any files in directories, to be executed. As plugin contains a some inner directory, scripts in this directory won’t be executed (security reasons).

It works, if you remove the directory from the request filtering hidden segments in the IIS admin console. You might consider calling the directory different for the future – to avoid problems with IIS installations.

You can add attached javascript code file …. /wp-content/plugins/html5-video-player-with-playlist/videoplayer/index.php

<script type=”text/javascript”>
var windowwidth = jQuery(window).width();
var windowheight = jQuery(window).height();

jQuery(window).resize(function() {
windowwidth = jQuery(window).width()*(<?php echo $width;?> / 100);
windowheight = jQuery(window).height()*(<?php echo $height;?> / 100);

jQuery(“#html5player<?php echo $rnd; ?>”).css(“width”, (windowwidth / 15)+’px’);

jQuery(“#html5player<?php echo $rnd; ?>”).css(“height”, (windowheight / 10)+’px’);

console.log(windowwidth);
});
</script>

Copyrighted Music Publicly?

When you buy an audio file, software, or CD, even those specifically marketed for business purposes, the purchase price covers only your private listening use, regardless of how they are labeled. Once you decide to play any copyrighted music publicly, you need permission from the copyright owners……

Can I add copyrighted songs to the player?

Of course you can, unlike a common misconception, you are not “uploading” files to the player, you are letting the in-game player know where your music files are on your computer. No uploading of any music takes place, you can add any songs you want to your music player……

Music Sharing?

We know about legal music sharing and violating copyright by hosting MP3 files on our hosting server. We are providing HTML5 MP3 Music/Audio Player with Flash fallback to listen MP3 music to our customers/users. The customers are purchasing HTML5 MP3 Player with playlist not music.
We are not selling or hosting or uploading copyrighted or unlicensed music on our hosting server…….

HTML5 MP3 Players

The autoplay option does not work on Apple iOS mobile devices (iPhone, iPad, iPod) because Apple specifically prohibits it. Basically, iOS devices requires actual user interaction (physical touch) to start play Audio / Video Players.

According to Apple documentation:

Controls are always supplied during fullscreen playback on iPhone and iPod touch, and the placeholder allows the user to initiate fullscreen playback. On the desktop or iPad, you must either include the controls attribute or provide playback controls using JavaScript. It is especially important to provide user controls on iPad because autoplay is disabled to prevent unsolicited cellular download.

In Safari on iOS (for all devices, including iPad), where the user may be on a cellular network and be charged per data unit, preload and autoplay are disabled. No data is loaded until the user initiates it. This means the JavaScript play() and load() methods are also inactive until the user initiates playback, unless the play() or load() method is triggered by user action. In other words, a user-initiated Play button works, but an onLoad=”play()” event does not.

iOS-Specific Considerations

Browser & format support
With Flash as a fallback, it should work pretty much anywhere.
It has been verified to work across:
– Mobile Safari (iOS 3+)
– Android (2.2+, w/Flash), Android (4.0+)
– Safari (4+)
– Chrome (7+)
– Firefox (3+, w/ Flash)
– Opera (10+, w/ Flash)
– IE (6, 7, 8, w/ Flash)

Some Time JavaScript & Flash player cause issue on Windows XP + IE8 … please make sure you have latest Flash Player and No JavaScript Errors on Player Page …

if (!Date.now) {
Date.now = function() { return new Date().getTime(); };
}

var currentTime = Date.now() || +new Date();

HTML5 MP3 Player uses native <audio> where available and an invisible flash player to emulate <audio> for other browsers. It provides a consistent html player UI to all browsers which can be styled used standard css.

Browser & format support
With Flash as a fallback, it should work pretty much anywhere.
It has been verified to work across:
– Mobile Safari (iOS 3+)
– Android (2.2+, w/Flash), Android (4.0+)
– Safari (4+)
– Chrome (7+)
– Firefox (3+, w/ Flash)
– Opera (10+, w/ Flash)
– IE (6, 7, 8, w/ Flash)

There is a og:url tag in Facebook Open Graph Tags. If you know the parent page URL of the embedded content, you can set og:url parameter with the parent page URL. Then, it behaves like the way you share the parent page.

Facebook Share

<meta property=”og:type” content=”article”/>
<meta property=”og:title” content=”TITLE”/>
<meta property=”og:url” content=”URL”/>
<meta property=”og:image” content=”IMAGE”/>
<meta property=”og:description” content=”DESCRIPTION…”/>
<meta property=”og:site_name” content=”WEBSITE”/>
<meta property=”fb:app_id” content=”FB_APP_ID”/>

HTML5 Video Player plugin uses Flash & HTML5 on all modern devices and web browsers, On Android, iPhone and iPad the Video Player will go to HTML5 mode.

When you try to activate it.. If you get Fatal error: Call to undefined function dbDelta() in ** wp-content/plugins/html5-video-player-with-playlist/index.php on line 211

Easy Fix:

Find dbDelta($sql); in plugin file “index.php” and replace it with

//dbDelta($sql);
$wpdb->query($sql);

OR

//dbDelta($sql);
mysql_query($sql);

http://yourdomain.com/audiojs/audiojs.swf?playerInstance=audiojs.instances[%27audiojs0%27]&datetime=1382426114401.4087

Solution:

Just replace code (Original audio.js)

flashSource: ‘\
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ id=”$1″ width=”1″ height=”1″ name=”$1″ style=”position: absolute; left: -1px;”> \
<param name=”movie” value=”$2?playerInstance=’+audiojs+’.instances[\’$1\’]&datetime=$3″> \
<param name=”allowscriptaccess” value=”always”> \
<embed name=”$1″ src=”$2?playerInstance=’+audiojs+’.instances[\’$1\’]&datetime=$3″ width=”1″ height=”1″ allowscriptaccess=”always”> \
</object>’,

with

flashSource: ‘\
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ id=”$1″ width=”1″ height=”1″ name=”$1″ style=”position: absolute; left: -1px;”> \
<param name=”movie” value=”$2?playerInstance=’+audiojs+’.instances[&quot;$1&quot;]&datetime=$3″> \
<param name=”allowscriptaccess” value=”always”> \
<embed name=”$1″ src=”$2?playerInstance=’+audiojs+’.instances[&quot;$1&quot;]&datetime=$3″ width=”1″ height=”1″ allowscriptaccess=”always”> \
</object>’,

This is not permission (0755 or 0777) error of SWF file, Make sure you have valid characters on some browsers…

instances[\’$1\’] => instances[&quot;$1&quot;] 😉

HTML5 Video Player with Playlist have HTML5 video the element enable native video playback within the browser.  It supports all browsers i.e. iOS, Android, Firefox, Chrome, Safari, IE and Opera.

You can enable single html5 video without playlist using below code..

You need to remove 2 options in JavaScript

playlist: ‘<?php echo plugin_dir_url(__FILE__); ?>../xml/<?php echo $xml; ?>’,
vertical: <?php echo $playlistmod; ?>,

For single video JavaScript look like →

<script type=”text/javascript”>
jQuery(function() {
jQuery(“#html5player<?php echo $rnd; ?>”).html5player({
width: ‘<?php echo $width; ?>px’,
height: ‘<?php echo $height; ?>px’,
autoNext: <?php echo $autonext; ?>,
shuffle: <?php echo $shuffle; ?>,
loop: <?php echo $loop; ?>,
scrollMode: “hover<?php //echo $scrollmode; ?>”, //”auto”
logo: “<?php echo $logo; ?>” // logo.png
});
});
</script>

<video id=”html5player<?php echo $rnd; ?>” src=”VIDEO-LINK” poster=”VIDEO-IMAGE-LINK”></video>

Below you can find a nice article … How Metadata work for Radio Stream

PHP can parse song metadata from ICY streams including most of the streams on ShoutCast and IceCast.

1. Add “ICY Metadata: 1” to the HTTP GET headers.

// connect to server
$fp = fsockopen($host, $port, $errno, $errstr, 90);
if (!$fp) {
echo “$errstr ($errno)
\n”;
} else {
$out = “GET $path HTTP/1.0\r\n”;
$out .= “Icy-MetaData:1\r\n”;
$out .= “\r\n”;
fwrite($fp, $out);
}

2. Parse the icy-metaint from the HTTP response headers.

// check whether icy-metaint is present
if(!isset($headers[“icy-metaint”])) {
die(“icy-metaint not set”);
}

3. Begin the stream and get metadata information

The SHOUTcast/Icecast Radio Stream will return ICY 200 OK instead of HTTP 200 OK in its response.

Note: Please make sure with Radio Hosting Support … if icy-metaint is present in your Radio Stream

No Redirections in Radio Stream:

http://listen.domain.com/radiostream ==> http://streaming.domain.com/RadioStream?group=989

Note: Please make sure your Radio Stream don’t have any direction.

The autoplay option does not work on Apple iOS mobile devices (iPhone, iPad, iPod) because Apple specifically prohibits it. Basically, iOS devices requires actual user interaction (physical touch) to start play Audio / Video Players.

According to Apple documentation:

Controls are always supplied during fullscreen playback on iPhone and iPod touch, and the placeholder allows the user to initiate fullscreen playback. On the desktop or iPad, you must either include the controls attribute or provide playback controls using JavaScript. It is especially important to provide user controls on iPad because autoplay is disabled to prevent unsolicited cellular download.

In Safari on iOS (for all devices, including iPad), where the user may be on a cellular network and be charged per data unit, preload and autoplay are disabled. No data is loaded until the user initiates it. This means the JavaScript play() and load() methods are also inactive until the user initiates playback, unless the play() or load() method is triggered by user action. In other words, a user-initiated Play button works, but an onLoad=”play()” event does not.

iOS-Specific Considerations

Browser & format support
With Flash as a fallback, it should work pretty much anywhere.
It has been verified to work across:
– Mobile Safari (iOS 3+)
– Android (2.2+, w/Flash), Android (4.0+)
– Safari (4+)
– Chrome (7+)
– Firefox (3+, w/ Flash)
– Opera (10+, w/ Flash)
– IE (6, 7, 8, w/ Flash)

Some Time JavaScript & Flash player cause issue on Windows XP + IE8 … please make sure you have latest Flash Player and No JavaScript Errors on Player Page …

if (!Date.now) {
Date.now = function() { return new Date().getTime(); };
}

var currentTime = Date.now() || +new Date();

If Radio Stream don’t have valid Radio Stream Codec Info then some Shoutcast Icecast mp3’s won’t play in html5 audio player

Please make sure you are using Valid Format Codec Radio Stream in HTML5 Radio Players

Best Codec, Sample Rate, Bitrate and Channel for Radio Icecast / Shoutcast Streaming

Standard Working Stream Info
Type: Audio
Codec: MPEG Audio layer 1/2/3 (mpga)
Channels: Stereo
Sample rate: 44100 Hz
Bitrate: 128 kb/s

Note: Icecast/Shoutcast MP3/AAC Radio stream must be 44100hz & 128kb/s stereo to work perfectly in players.

Other Stream Info
Type: Audio
Codec: MPEG Audio layer 1/2/3 (mpga)
Channels: Mono
Sample rate: 11025 Hz
Bitrate: 16 kb/s

If you installed this player http://html5plus.svnlabs.com/shop/html5-mp3-radio-fm-stream/ but it’s consuming a tremendous amount of server resources:

Users on Share Web Host could not allow/open Radio Server port to web server firewall as outgoing port to read shoutcast / icecast current playing song information…

You can turn off song meta data, but if users want to see that. It is still possible to embed a separate ticker on the site to show this information 🙂

If your server can’t support for metadata …. and it taking too much CPU / Memory ..

You can subscribe to our API get all Metadata for Icecast / Shoutcast Servers its $5 / month
http://www.radioforge.com/icecast-shoutcast-metadata/

Its very easy…..

https://wordpress.org/plugins/shoutcast-icecast-html5-radio-player/

Just find iframe based code from WordPress admin plugin player setting page …. then make a html page “player.html” paste iframe embed code … use JavaScript to make popup using this new html page “player.html” 😉

<button onclick="myFunction()">Try it</button>  OR <a href="javascript:void(0);" onclick="myFunction()">Listen Live</a>

<script>
function myFunction() {
    window.open("http://domain.com/player.html", "_blank", "toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=400, height=400");
}
</script>

http://www.w3schools.com/jsref/met_win_open.asp

Is it possible to change the direction of the rolling text/song information in HTML5 Shoutcast / Icecast Radio Player? At the moment it’s going from left to right but we would like it to go into the other direction.

Yes, Please find files in wordpress plugin folder

– shoutcast-icecast-html5-radio-player/html5/html5shoutcast.php
– shoutcast-icecast-html5-radio-player/html5/html5icecast.php

Or

– html5-mp3-player-with-playlist/html5plus/html5full.php
– html5-mp3-player-with-playlist/html5plus/html5big.php
– html5-mp3-player-with-playlist/html5plus/html5small.php

then find tag <marquee …. and change direction=”right” to direction=”left”

Hope you have already purchased “HTML5 MP3 Radio FM Stream” from here http://html5plus.svnlabs.com/shop/html5-mp3-radio-fm-stream/

Check Radio Demo here… http://html5plus.svnlabs.com/shop/html5-mp3-radio-fm-stream/

There is a difference between versions of shoutcast. 1.9.9 doesn’t support HTML5 Audio where 1.9.8 is compatible with HTML5 Audio

Please check our FAQ Section for more help…
Shoutcast Stream is not working?

Hello,

You can find style files here… We are using images for backgrounds

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/css/player.css in this CSS you can find image “../images/player-bg.jpg” .. that is black .. you can replace with new image

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/images/player-bg.jpg

And same for big player

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/css/player_big.css .. image background

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/images/player-big-bg.jpg
http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/images/player-bg-small.jpg

You can change color of these image to your requirements in paid version of HTML5 MP3 Player 😉

Thanks

Hello,

We have variety of players

https://www.svnlabs.com/html5/

– Small HTML5 MP3 Player
– Horizontal / Vertical HTML5 MP3 Player
– Footer Stick Player
– Karaoke Player
– Pay Per Video Player

Please select your choice … we can provide plugin for – Joomla / WordPress 🙂

Thanks

Now plugin users can create dynamic playlist using new plugin addon…

Addon need MP3 Folder link to read all mp3 files in any folder publicly accessed

Example: https://www.svnlabs.com/mp3/ https://www.svnlabs.com/songs/

HTML5 MP3 Player with Playlist addon can read private folders using PHP on same server

Read more about this addon

Customization is not possible for free version 🙁

You need to purchase code for HTML5 MP3 Player

You can add us on skype: svnlabs for more help

We are developers of HTML5 MP3 Player

We will be happy to assist you 🙂

Tabbed playlists in single player is possible

We have 3 options in HTML5 MP3 Player with rectangle cover image

Horizontal Playlist – 566×207

Vertical Playlist – 347×414

No Playlist – 347×207

You can easily customize rectangle cover image to square cover image

You need to edit cover image size in PHP files

– html5full.php
– html5small.php
– html5big.php

Amazon S3 Bucket Region and there Website Endpoint

US Standard : s3-website-us-east-1.amazonaws.com
US West (Origon) Region : s3-website-us-west-2.amazonaws.com
US West (Northern California) : s3-website-us-west-1.amazonaws.com
EU (Ireland) : s3-website-eu-west-1.amazonaws.com
Singapore ( Asia Pacific ) : s3-website-ap-southeast-1.amazonaws.com
Tokyo ( Asia Pacific ) : s3-website-ap-northeast-1.amazonaws.com
South America (Sao Paulo) Region : s3-website-sa-east-1.amazonaws.com

“Servers should be limit on URI lengths above 255 bytes because some older client or proxy implementations may not properly support these lengths.”

Different browser agents support different URI length acceptance. In addition, servers too play a role in accepting/denying URI’s over certain length which may either truncate the URI or may give lengthy URI message indications.

WordPress and Standalone HTML5 MP3 Radio FM Stream Plugin compatible with iOS, Android and supports all browsers Firefox, Chrome, Safari, IE and Opera!

HTML5 MP3 Radio FM MP3 Stream Player can grab “Now Playing Song Information” on player as StreamTitle for Shoutcast and Icecast Streams.

HTML5 MP3 Radio Icecast Stream player and have got the stream to play but I get this error…

“Fatal error: Call to undefined function parse_ini_string() in
/public_html/wp-content/plugins/shoutcast-icecast-html5-radio-player/html5/icecast.php on line 51”

Solution:

Comment the if conditions for function parse_ini_string( $string ) 😉

///if( !function_exists(‘parse_ini_string’) ){

///}

You can figure out why the mp3’s were not playing in Chrome. The ID3 information was too long and then Chrome doesn’t recognize it as an mp3 file. You were mixing down the sets in Adobe Audition and it was adding tags and markers into the ID3.

Chrome must read ID3 information and the other browsers don’t do that yet at this point…..

You can find block of code in core files in html5 folder

– html5full.php
– html5small.php
– html5big.php

You need to remove …..

<a href=”https://twitter.com/intent/tweet?status=<?php echo “HTML5 MP3 Player with Playlist “; ?><?php echo urlencode(‘https://www.svnlabs.com/html5’); ?>&amp;url=<?php echo urlencode(‘https://www.svnlabs.com/html5’); ?>” target=”_blank” title=”Twitter”><img src=”twitter.png” border=”0″ width=”20″ /></a><a href=”https://www.facebook.com/sharer/sharer.php?u=<?php echo urlencode(‘https://www.svnlabs.com/html5’); ?>” target=”_blank” title=”Facebook”><img src=”facebook.png” border=”0″ width=”20″ /></a><a href=”https://www.svnlabs.com/html5″ target=”_blank” title=”HTML5 MP3 Player with Playlist”><img src=”link-icon.png” border=”0″ width=”20″ /></a>

OR

<a href=”https://www.svnlabs.com/html5″ target=”_blank” title=”HTML5 MP3 Player with Playlist”><img src=”link-icon.png” border=”0″ width=”20″ /></a>

– Remote file read file_get_contents()
– XML functions simplexml_load_string()
– File functions fopen(), fread(), fclose()
– php mysql function

List of php.ini directives

Description of core php.ini directives

W3C will throw error for iframes, so you need to use object tags in place of iframe tags.

<?php

if($matches[1][0]==”full”)
{
$replace = ‘<object data=”https://www.svnlabs.com/html5/html5full.php?id=’.$matches[2][0].’&bg=f6f6f6″ type=”text/html” width=”606″ height=”230″ style=”border: medium none; background-color:#f6f6f6; overflow:hidden; width: 606px; height: 230px;”></object>’;
}
else if($matches[1][0]==”big”)
{
$replace = ‘<object data=”https://www.svnlabs.com/html5/html5big.php?id=’.$matches[2][0].’&bg=f6f6f6″ type=”text/html” width=”386″ height=”434″ style=”border: medium none; background-color:#f6f6f6; overflow:hidden; width: 386px; height: 434px;”></object>’;
}
else
{
$replace = ‘<object data=”https://www.svnlabs.com/html5/html5small.php?id=’.$matches[2][0].’&bg=f6f6f6″ type=”text/html” width=”386″ height=”230″ style=”border: medium none; background-color:#f6f6f6; overflow:hidden; width: 386px; height: 230px;”></object>’;
}

if($matches[1][0]==”full”)
{
$replace = ‘<iframe src=”https://www.svnlabs.com/html5/html5full.php?id=’.$matches[2][0].'” frameborder=”0″ marginheight=”0″ marginwidth=”0″ scrolling=”no” width=”566″ height=”207″></iframe>’;
}
else if($matches[1][0]==”big”)
{
$replace = ‘<iframe src=”https://www.svnlabs.com/html5/html5big.php?id=’.$matches[2][0].'” frameborder=”0″ marginheight=”0″ marginwidth=”0″ scrolling=”no” width=”347″ height=”414″></iframe>’;
}
else
{
$replace = ‘<iframe src=”https://www.svnlabs.com/html5/html5small.php?id=’.$matches[2][0].'” frameborder=”0″ marginheight=”0″ marginwidth=”0″ scrolling=”no” width=”347″ height=”207″></iframe>’;
}

?>

Instructions:

To Listen: Click on the Chapel you would like to listen then click the Play button. The audio files are large and depending on your connection may take a moment to load. Press pause then play if this happens.

To Download: Click the Download icon. It will popup a new web browser window. From there, choose File > Save As. Note that not all browsers may have this option.

Plugin Forums

RSS link for this plugin’s support threads.

Subscribe to Emails for this Plugin

Warning: trigger_error() expects parameter 2 to be long, string given in
/home/churc814/public_html/wp-content/plugins/amazon-s3-cloud-html5-mp3-player/s3/S3.php on line 222

Warning: Invalid argument supplied for foreach() in
/home/churc814/public_html//wp-content/plugins/amazon-s3-cloud-html5-mp3-player/html5/html5full.php on line 138

Solution:

Please make sure you have entered valid information (Key case and spaces) 🙂

Please double check Amazon S3 Bucket Endpoints in plugin setting’s page

Add your amazon information valid amazon key and valid (no spaces) amazon secret key. Then just add a bucket to your account add folders.

Make sure you have public permission for all your music in your S3 buckets and folders.

If HTML5 Player’s Javascripts and other resources are giving 404 error …

The problem with IIS7 Webserver on Windows is, that “Request filtering” doesn’t allow any files in directories, to be executed. As plugin contains a some inner directory, scripts in this directory won’t be executed (security reasons).

It works, if you remove the directory from the request filtering hidden segments in the IIS admin console. You might consider calling the directory different for the future – to avoid problems with IIS installations.

You can add attached javascript code file …. /wp-content/plugins/html5-video-player-with-playlist/videoplayer/index.php

<script type=”text/javascript”>
var windowwidth = jQuery(window).width();
var windowheight = jQuery(window).height();

jQuery(window).resize(function() {
windowwidth = jQuery(window).width()*(<?php echo $width;?> / 100);
windowheight = jQuery(window).height()*(<?php echo $height;?> / 100);

jQuery(“#html5player<?php echo $rnd; ?>”).css(“width”, (windowwidth / 15)+’px’);

jQuery(“#html5player<?php echo $rnd; ?>”).css(“height”, (windowheight / 10)+’px’);

console.log(windowwidth);
});
</script>

Copyrighted Music Publicly?

When you buy an audio file, software, or CD, even those specifically marketed for business purposes, the purchase price covers only your private listening use, regardless of how they are labeled. Once you decide to play any copyrighted music publicly, you need permission from the copyright owners……

Can I add copyrighted songs to the player?

Of course you can, unlike a common misconception, you are not “uploading” files to the player, you are letting the in-game player know where your music files are on your computer. No uploading of any music takes place, you can add any songs you want to your music player……

Music Sharing?

We know about legal music sharing and violating copyright by hosting MP3 files on our hosting server. We are providing HTML5 MP3 Music/Audio Player with Flash fallback to listen MP3 music to our customers/users. The customers are purchasing HTML5 MP3 Player with playlist not music.
We are not selling or hosting or uploading copyrighted or unlicensed music on our hosting server…….

HTML5 MP3 Players

The autoplay option does not work on Apple iOS mobile devices (iPhone, iPad, iPod) because Apple specifically prohibits it. Basically, iOS devices requires actual user interaction (physical touch) to start play Audio / Video Players.

According to Apple documentation:

Controls are always supplied during fullscreen playback on iPhone and iPod touch, and the placeholder allows the user to initiate fullscreen playback. On the desktop or iPad, you must either include the controls attribute or provide playback controls using JavaScript. It is especially important to provide user controls on iPad because autoplay is disabled to prevent unsolicited cellular download.

In Safari on iOS (for all devices, including iPad), where the user may be on a cellular network and be charged per data unit, preload and autoplay are disabled. No data is loaded until the user initiates it. This means the JavaScript play() and load() methods are also inactive until the user initiates playback, unless the play() or load() method is triggered by user action. In other words, a user-initiated Play button works, but an onLoad=”play()” event does not.

iOS-Specific Considerations

Browser & format support
With Flash as a fallback, it should work pretty much anywhere.
It has been verified to work across:
– Mobile Safari (iOS 3+)
– Android (2.2+, w/Flash), Android (4.0+)
– Safari (4+)
– Chrome (7+)
– Firefox (3+, w/ Flash)
– Opera (10+, w/ Flash)
– IE (6, 7, 8, w/ Flash)

Some Time JavaScript & Flash player cause issue on Windows XP + IE8 … please make sure you have latest Flash Player and No JavaScript Errors on Player Page …

if (!Date.now) {
Date.now = function() { return new Date().getTime(); };
}

var currentTime = Date.now() || +new Date();

HTML5 MP3 Player uses native <audio> where available and an invisible flash player to emulate <audio> for other browsers. It provides a consistent html player UI to all browsers which can be styled used standard css.

Browser & format support
With Flash as a fallback, it should work pretty much anywhere.
It has been verified to work across:
– Mobile Safari (iOS 3+)
– Android (2.2+, w/Flash), Android (4.0+)
– Safari (4+)
– Chrome (7+)
– Firefox (3+, w/ Flash)
– Opera (10+, w/ Flash)
– IE (6, 7, 8, w/ Flash)

If Radio Stream don’t have valid Radio Stream Codec Info then some Shoutcast Icecast mp3’s won’t play in html5 audio player

Please make sure you are using Valid Format Codec Radio Stream in HTML5 Radio Players

Best Codec, Sample Rate, Bitrate and Channel for Radio Icecast / Shoutcast Streaming

Standard Working Stream Info
Type: Audio
Codec: MPEG Audio layer 1/2/3 (mpga)
Channels: Stereo
Sample rate: 44100 Hz
Bitrate: 128 kb/s

Note: Icecast/Shoutcast MP3/AAC Radio stream must be 44100hz & 128kb/s stereo to work perfectly in players.

Other Stream Info
Type: Audio
Codec: MPEG Audio layer 1/2/3 (mpga)
Channels: Mono
Sample rate: 11025 Hz
Bitrate: 16 kb/s

There is a og:url tag in Facebook Open Graph Tags. If you know the parent page URL of the embedded content, you can set og:url parameter with the parent page URL. Then, it behaves like the way you share the parent page.

Facebook Share

<meta property=”og:type” content=”article”/>
<meta property=”og:title” content=”TITLE”/>
<meta property=”og:url” content=”URL”/>
<meta property=”og:image” content=”IMAGE”/>
<meta property=”og:description” content=”DESCRIPTION…”/>
<meta property=”og:site_name” content=”WEBSITE”/>
<meta property=”fb:app_id” content=”FB_APP_ID”/>

Song information is Ajax based process that will run every 5 mins

This is only one way to get song’s information in HTML5 based players 🙂

We can reduce Ajax request time to get updated information every 1 or 2 mins

You can review other html5 products, I will be here if you need my plugin

https://www.svnlabs.com/html5/radio-fm-stream/

Please try unicode mp3 links in XML file

Like:

http://server.com/mp3/បើសិនអូនជាសង្សារបង.mp3 (MP3 from any server or domain)

or

http://ip-address/audio/បើសិនអូនជាសង្សារបង.mp3 (MP3 from any server using IP Address)

I have tested on WordPress 3.4.1.

Its working fine for me

http://blog.svnlabs.com/work/wordpress-3-4-1/

If you are checking here http://wordpress.org/extend/plugins/html5-mp3-player-with-playlist/installation/

Free plugin is old .. new one is compatible with WordPress 3.4.1.

http://blog.svnlabs.com/work/wordpress-3-4-1/

Paid Features…

1. Vertical (Big) playlist
2. Random/Shuffle mode in playlist
3. Download Option
4. Customize Twitter / Facebook links
5. Support iOS / Android
6. Stream MP3 HTTP Stream from Wowza, Cloudfront, CDN etc.
7. More customization available as you get full files hosted on your server 😉

https://www.svnlabs.com/html5/wordpress-plugins/

Using this addon two or more players can be added on the same page or post.

1. Both full players
2. Small and Full Players
3. Both Small Players
4. Big and Small Players
5. Full and Big Players
6. Both Big Players

https://www.svnlabs.com/html5/multiple-players-on-same-page-using-shortcode/

Please check below javascript file link to auto play playlist

https://www.svnlabs.com/html5/audiojs/audio.js

settings: {
autoplay: true,

You need to update audio.js file in “wp-content/plugins/html5-mp3-player-with-playlist/html5/audiojs/”

OR

Add below statement in player file html5small.php, html5full.php or html5big.php on body load function 😉

$(‘.playing’).click(); //for autoplay

Soundcloud provide playlists as Sets URL like: http://soundcloud.com/USER-NAME/sets/SET-NAME/

Make sure your Soundcloud Sets are PUBLIC to play in player

How to make SoundCloud Set PUBLIC??

You need to go to soundcloud page i.e. http://soundcloud.com/USER-NAME/sets/SET-NAME/edit

My SoundCloud PUBLIC set: https://soundcloud.com/svnlabs/sets/svnlabs

Please review … if you know HTML / CSS / PHP

https://www.svnlabs.com/html5/html5-mp3-player-with-downloadable-playlist-option/

For download option you need to edit files here…

wp-content/plugins/html5-mp3-player-with-playlist/html5/html5full.php

wp-content/plugins/html5-mp3-player-with-playlist/html5/html5big.php

Find:

<li>
<a href=”#” data-src=”<?php echo $mp3s; ?>” title=”<?php echo $mp3t; ?>” class=”track-name” name=”<?php echo $mp3p; ?>”><?php echo $mp3t; ?></a>
<p class=”Title01″><?php echo $mp3a; ?></p>
</li>

Add above it:

<span style=”right:27px; position:absolute;”>&nbsp;&nbsp;<a href=”<?php echo $mp3s; ?>” download=”MyDown” style=”z-index:1000; position:absolute;” target=”_blank” title=”Download”><img src=”download.jpg” border=”0″ width=”17″ /></a></span>

Its very easy…..

https://wordpress.org/plugins/shoutcast-icecast-html5-radio-player/

Just find iframe based code from WordPress admin plugin player setting page …. then make a html page “player.html” paste iframe embed code … use JavaScript to make popup using this new html page “player.html” 😉

<button onclick="myFunction()">Try it</button>  OR <a href="javascript:void(0);" onclick="myFunction()">Listen Live</a>

<script>
function myFunction() {
    window.open("http://domain.com/player.html", "_blank", "toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=400, height=400");
}
</script>

http://www.w3schools.com/jsref/met_win_open.asp

Is it possible to play shoutcast internet radio streams with html5?

Add semicolon after shoutcast link 😉
http://yourdomain:port/;

How could I play a shoutcast/icecast stream using HTML5?

<!DOCTYPE html>
<audio controls src=”http://domain.com:8010/;”></audio>

You can add iFrame code from HTML5 MP3 Player plugin in wordpress sidebar…

Please check short-code here
https://www.svnlabs.com/html5/shortcodes/

If you have self hosted plugin then you need to replace domain name

www.svnlabs.com/html5 => www.domain.com

[divider]

[toggle_code title=”iFrame Codes”]

Small Player (No Playlist): <iframe src=”https://www.svnlabs.com/html5/html5small.php?id=1″ frameborder=”0″ marginheight=”0″ marginwidth=”0″ scrolling=”no” width=”347″ height=”207″></iframe>

Full Player (With Playlist): <iframe src=”https://www.svnlabs.com/html5/html5full.php?id=276″ frameborder=”0″ marginheight=”0″ marginwidth=”0″ scrolling=”no” width=”566″ height=”207″></iframe>

[/toggle_code]

HTML5 MP3 Player in sidebar

[divider]

Yes, You can adjust audio volume to custom level using javascript

defaultValue: 8,

Set defaultValue to custom value …

We are using that JavaScript statement in function

Paid Version:

1. Vertical playlist https://www.svnlabs.com/html5/vertical-playlist/
2. You can take backup your xml files becoz file will be hosted on your server
3. We will assist on skype for paid support
4. Paid version have fully customize link, text, images etc. using HTML5 and CSS
5. Paid plugin also support WordPress 3.5
6. Random/Shuffle mode in playlist

Addon: https://www.svnlabs.com/html5/multiple-players-on-same-page-using-shortcode/

Icecast Streaming Media Server

fsockopen() [function.fsockopen]: unable to connect to icecast-ip-address:port (Connection refused)

IceCast Stream
http://icecast-ip-address:port/stream
http://icecast-ip-address:port/live

You must contact to your icecast hosting support for IP, Port, Domain blocking 😉

Make sure you have icecast port opened on HTML5 MP3 Plugin server 😉

Now plugin users can create dynamic playlist using new plugin addon…

Addon need MP3 Folder link to read all mp3 files in any folder publicly accessed

Example: https://www.svnlabs.com/mp3/ https://www.svnlabs.com/songs/

HTML5 MP3 Player with Playlist addon can read private folders using PHP on same server 😉

Other plugin

HTML5 MP3 Player with Playlist for Feedburner

<?php

$s = ‘http://www.domain.com/songs/4 THE SICK – 13 – Because Of U featuring Evan Eleazer.mp3’;

$s = str_replace(” “, “%20”, $s);

// OR

$s = preg_replace(‘/ /i’, ‘%20’, $s);

echo $s;

?>

Output: http://www.domain.com/songs/4%20THE%20SICK%20-%2013%20-%20Because%20Of%20U%20featuring%20Evan%20Eleazer.mp3

Is it possible to change the direction of the rolling text/song information in HTML5 Shoutcast / Icecast Radio Player? At the moment it’s going from left to right but we would like it to go into the other direction.

Yes, Please find files in wordpress plugin folder

– shoutcast-icecast-html5-radio-player/html5/html5shoutcast.php
– shoutcast-icecast-html5-radio-player/html5/html5icecast.php

Or

– html5-mp3-player-with-playlist/html5plus/html5full.php
– html5-mp3-player-with-playlist/html5plus/html5big.php
– html5-mp3-player-with-playlist/html5plus/html5small.php

then find tag <marquee …. and change direction=”right” to direction=”left”

HTML5 MP3 Player with Playlist can be used on different page and post using shortcodes: https://www.svnlabs.com/html5/shortcodes/

You need to create XML/RSS based playlist first

Small Player (No Playlist): [html5mp3small:ID]

Full Player (With Playlist): [html5mp3full:ID]

Here ID is identifier of playlist you created 😉

We have addon to read folder of mp3 files to create XML based playlist dynamically

HTML5 MP3 Player Folder Addon

Thanks

Paid version of HTML5 MP3 Player with Playlist have download feature in playlist.

You can customize MP3 downloads and can add buy now button near download link

https://www.svnlabs.com/html5/html5-mp3-player-with-downloadable-playlist-option/

We have another addon to customize color and size of HTML5 MP3 Player with Playlist that is CSS based.

HTML5 MP3 Playlist Player Custom Color Size

You can customize player to fit on your website using custome size and colors.

HTML5 MP3 Playlist Player Custom Color Size

HTML5 MP3 Playlist Player Custom Color Size Options

Sample Player

Question:

I need a quote for your players and I need to know the following:

The music will get intrupted if the page change in the same
website?
If yes, is it possible to stick it to all the pages and just keep
musics to play during the page change?
Is it able to add new songs from different pages by a click on
musics?
would you be interested to develop a player with more functionality?

Answer:

You need to use “Frames Website Template” for your page / website
http://blog.svnlabs.com/frames-website-template/

You can use any frame for HTML5 MP3 Player Plugin …

Question:

What I want to do is have 1 player on the page that can access multiple playlists that the end user can select from and play the applicable content. Is that possible?

Answer:

https://www.svnlabs.com/html5/faq/multiple-players-on-same-page-using-shortcode-addon/

Yes, We can create a new addon “Tabbed playlists in single player” for that 😉

The XML Playlist files for free version are hosted on https://www.svnlabs.com/html5/ in xml folder 😉
Like https://www.svnlabs.com/html5/xml/1347391361.xml ..

You will lose all XML files when you upgrade plugin from Free to Paid (Self Hosted) Version.
So, Please take backup for your old XML Playlist files from Free version.

You can download your old XML files hosted on server https://www.svnlabs.com/html5/ (If you know the name of XML files)

Using : https://www.svnlabs.com/html5/xml/XML-File-Name

Example: https://www.svnlabs.com/html5/xml/1347391361.xml

You can request us for lost XML Playlist Files if you know your playlist ID for Free Plugin 😉

Playlist ID : [html5mp3full:5259] or [html5mp3full:ID]

Thanks for purchase HTML5 Audio Player with Playlist

HTML5 MP3 Players

This a complete package for HTML5 MP3 XML based playlist player

1. Upload and Unzip html5-mp3-player-with-playlist.zip on your web server wordpress installation folder “wp-content/plugins”

2. Activate Plugin from Plugins http://domain.com/wp-admin/plugins.php

3. Create XML based playlist
http://domain.com/wp-admin/options-general.php?page=html5mp3playlist

4. Copy & Paste shortcode to wordpress post or page editor

[html5mp3full:1] OR [html5mp3small:1]

Support Email: [email protected]

Embed Code Button in HTML5 MP3 Player

Iframe based Embed code text area to copy code

HTML5 Video Player plugin uses Flash & HTML5 on all modern devices and web browsers, On Android, iPhone and iPad the Video Player will go to HTML5 mode.

When you try to activate it.. If you get Fatal error: Call to undefined function dbDelta() in ** wp-content/plugins/html5-video-player-with-playlist/index.php on line 211

Easy Fix:

Find dbDelta($sql); in plugin file “index.php” and replace it with

//dbDelta($sql);
$wpdb->query($sql);

OR

//dbDelta($sql);
mysql_query($sql);

Original Player

Re-sized Player

Use below code

<div style=”-moz-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -webkit-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -o-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -ms-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); clear:both; float:left;”><iframe src=”http://html5player.svnlabs.com/v1/html5full.html?id=276″ height=”227″ width=”586″ frameborder=”0″ marginwidth=”0″ marginheight=”0″ scrolling=”no”></iframe></div>

Div Style

style=”-moz-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -webkit-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -o-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -ms-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); clear:both; float:left;”

You can use suitable scale(.8) parameter to resize player on webpage 🙂
i.e. scale(.8), scale(.67), scale(.5) etc.

http://yourdomain.com/audiojs/audiojs.swf?playerInstance=audiojs.instances[%27audiojs0%27]&datetime=1382426114401.4087

Solution:

Just replace code (Original audio.js)

flashSource: ‘\
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ id=”$1″ width=”1″ height=”1″ name=”$1″ style=”position: absolute; left: -1px;”> \
<param name=”movie” value=”$2?playerInstance=’+audiojs+’.instances[\’$1\’]&datetime=$3″> \
<param name=”allowscriptaccess” value=”always”> \
<embed name=”$1″ src=”$2?playerInstance=’+audiojs+’.instances[\’$1\’]&datetime=$3″ width=”1″ height=”1″ allowscriptaccess=”always”> \
</object>’,

with

flashSource: ‘\
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ id=”$1″ width=”1″ height=”1″ name=”$1″ style=”position: absolute; left: -1px;”> \
<param name=”movie” value=”$2?playerInstance=’+audiojs+’.instances[&quot;$1&quot;]&datetime=$3″> \
<param name=”allowscriptaccess” value=”always”> \
<embed name=”$1″ src=”$2?playerInstance=’+audiojs+’.instances[&quot;$1&quot;]&datetime=$3″ width=”1″ height=”1″ allowscriptaccess=”always”> \
</object>’,

This is not permission (0755 or 0777) error of SWF file, Make sure you have valid characters on some browsers…

instances[\’$1\’] => instances[&quot;$1&quot;] 😉

HTML5 Video Player with Playlist have HTML5 video the element enable native video playback within the browser.  It supports all browsers i.e. iOS, Android, Firefox, Chrome, Safari, IE and Opera.

You can enable single html5 video without playlist using below code..

You need to remove 2 options in JavaScript

playlist: ‘<?php echo plugin_dir_url(__FILE__); ?>../xml/<?php echo $xml; ?>’,
vertical: <?php echo $playlistmod; ?>,

For single video JavaScript look like →

<script type=”text/javascript”>
jQuery(function() {
jQuery(“#html5player<?php echo $rnd; ?>”).html5player({
width: ‘<?php echo $width; ?>px’,
height: ‘<?php echo $height; ?>px’,
autoNext: <?php echo $autonext; ?>,
shuffle: <?php echo $shuffle; ?>,
loop: <?php echo $loop; ?>,
scrollMode: “hover<?php //echo $scrollmode; ?>”, //”auto”
logo: “<?php echo $logo; ?>” // logo.png
});
});
</script>

<video id=”html5player<?php echo $rnd; ?>” src=”VIDEO-LINK” poster=”VIDEO-IMAGE-LINK”></video>

Hello,

You can find style files here… We are using images for backgrounds

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/css/player.css in this CSS you can find image “../images/player-bg.jpg” .. that is black .. you can replace with new image

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/images/player-bg.jpg

And same for big player

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/css/player_big.css .. image background

http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/images/player-big-bg.jpg
http://www.domain.com/wp-content/plugins/html5-mp3-player-with-playlist/html5/images/player-bg-small.jpg

You can change color of these image to your requirements in paid version of HTML5 MP3 Player 😉

Thanks

Hello,

We have variety of players

https://www.svnlabs.com/html5/

– Small HTML5 MP3 Player
– Horizontal / Vertical HTML5 MP3 Player
– Footer Stick Player
– Karaoke Player
– Pay Per Video Player

Please select your choice … we can provide plugin for – Joomla / WordPress 🙂

Thanks

Now plugin users can create dynamic playlist using new plugin addon…

Addon need MP3 Folder link to read all mp3 files in any folder publicly accessed

Example: https://www.svnlabs.com/mp3/ https://www.svnlabs.com/songs/

HTML5 MP3 Player with Playlist addon can read private folders using PHP on same server

Read more about this addon

Customization is not possible for free version 🙁

You need to purchase code for HTML5 MP3 Player

You can add us on skype: svnlabs for more help

We are developers of HTML5 MP3 Player

We will be happy to assist you 🙂

Tabbed playlists in single player is possible

We have 3 options in HTML5 MP3 Player with rectangle cover image

Horizontal Playlist – 566×207

Vertical Playlist – 347×414

No Playlist – 347×207

You can easily customize rectangle cover image to square cover image

You need to edit cover image size in PHP files

– html5full.php
– html5small.php
– html5big.php

Amazon S3 Bucket Region and there Website Endpoint

US Standard : s3-website-us-east-1.amazonaws.com
US West (Origon) Region : s3-website-us-west-2.amazonaws.com
US West (Northern California) : s3-website-us-west-1.amazonaws.com
EU (Ireland) : s3-website-eu-west-1.amazonaws.com
Singapore ( Asia Pacific ) : s3-website-ap-southeast-1.amazonaws.com
Tokyo ( Asia Pacific ) : s3-website-ap-northeast-1.amazonaws.com
South America (Sao Paulo) Region : s3-website-sa-east-1.amazonaws.com

“Servers should be limit on URI lengths above 255 bytes because some older client or proxy implementations may not properly support these lengths.”

Different browser agents support different URI length acceptance. In addition, servers too play a role in accepting/denying URI’s over certain length which may either truncate the URI or may give lengthy URI message indications.

You can figure out why the mp3’s were not playing in Chrome. The ID3 information was too long and then Chrome doesn’t recognize it as an mp3 file. You were mixing down the sets in Adobe Audition and it was adding tags and markers into the ID3.

Chrome must read ID3 information and the other browsers don’t do that yet at this point…..

You can find block of code in core files in html5 folder

– html5full.php
– html5small.php
– html5big.php

You need to remove …..

<a href=”https://twitter.com/intent/tweet?status=<?php echo “HTML5 MP3 Player with Playlist “; ?><?php echo urlencode(‘https://www.svnlabs.com/html5’); ?>&amp;url=<?php echo urlencode(‘https://www.svnlabs.com/html5’); ?>” target=”_blank” title=”Twitter”><img src=”twitter.png” border=”0″ width=”20″ /></a><a href=”https://www.facebook.com/sharer/sharer.php?u=<?php echo urlencode(‘https://www.svnlabs.com/html5’); ?>” target=”_blank” title=”Facebook”><img src=”facebook.png” border=”0″ width=”20″ /></a><a href=”https://www.svnlabs.com/html5″ target=”_blank” title=”HTML5 MP3 Player with Playlist”><img src=”link-icon.png” border=”0″ width=”20″ /></a>

OR

<a href=”https://www.svnlabs.com/html5″ target=”_blank” title=”HTML5 MP3 Player with Playlist”><img src=”link-icon.png” border=”0″ width=”20″ /></a>

– Remote file read file_get_contents()
– XML functions simplexml_load_string()
– File functions fopen(), fread(), fclose()
– php mysql function

List of php.ini directives

Description of core php.ini directives

W3C will throw error for iframes, so you need to use object tags in place of iframe tags.

<?php

if($matches[1][0]==”full”)
{
$replace = ‘<object data=”https://www.svnlabs.com/html5/html5full.php?id=’.$matches[2][0].’&bg=f6f6f6″ type=”text/html” width=”606″ height=”230″ style=”border: medium none; background-color:#f6f6f6; overflow:hidden; width: 606px; height: 230px;”></object>’;
}
else if($matches[1][0]==”big”)
{
$replace = ‘<object data=”https://www.svnlabs.com/html5/html5big.php?id=’.$matches[2][0].’&bg=f6f6f6″ type=”text/html” width=”386″ height=”434″ style=”border: medium none; background-color:#f6f6f6; overflow:hidden; width: 386px; height: 434px;”></object>’;
}
else
{
$replace = ‘<object data=”https://www.svnlabs.com/html5/html5small.php?id=’.$matches[2][0].’&bg=f6f6f6″ type=”text/html” width=”386″ height=”230″ style=”border: medium none; background-color:#f6f6f6; overflow:hidden; width: 386px; height: 230px;”></object>’;
}

if($matches[1][0]==”full”)
{
$replace = ‘<iframe src=”https://www.svnlabs.com/html5/html5full.php?id=’.$matches[2][0].'” frameborder=”0″ marginheight=”0″ marginwidth=”0″ scrolling=”no” width=”566″ height=”207″></iframe>’;
}
else if($matches[1][0]==”big”)
{
$replace = ‘<iframe src=”https://www.svnlabs.com/html5/html5big.php?id=’.$matches[2][0].'” frameborder=”0″ marginheight=”0″ marginwidth=”0″ scrolling=”no” width=”347″ height=”414″></iframe>’;
}
else
{
$replace = ‘<iframe src=”https://www.svnlabs.com/html5/html5small.php?id=’.$matches[2][0].'” frameborder=”0″ marginheight=”0″ marginwidth=”0″ scrolling=”no” width=”347″ height=”207″></iframe>’;
}

?>

Instructions:

To Listen: Click on the Chapel you would like to listen then click the Play button. The audio files are large and depending on your connection may take a moment to load. Press pause then play if this happens.

To Download: Click the Download icon. It will popup a new web browser window. From there, choose File > Save As. Note that not all browsers may have this option.

Plugin Forums

RSS link for this plugin’s support threads.

Subscribe to Emails for this Plugin

If HTML5 Player’s Javascripts and other resources are giving 404 error …

The problem with IIS7 Webserver on Windows is, that “Request filtering” doesn’t allow any files in directories, to be executed. As plugin contains a some inner directory, scripts in this directory won’t be executed (security reasons).

It works, if you remove the directory from the request filtering hidden segments in the IIS admin console. You might consider calling the directory different for the future – to avoid problems with IIS installations.

Copyrighted Music Publicly?

When you buy an audio file, software, or CD, even those specifically marketed for business purposes, the purchase price covers only your private listening use, regardless of how they are labeled. Once you decide to play any copyrighted music publicly, you need permission from the copyright owners……

Can I add copyrighted songs to the player?

Of course you can, unlike a common misconception, you are not “uploading” files to the player, you are letting the in-game player know where your music files are on your computer. No uploading of any music takes place, you can add any songs you want to your music player……

Music Sharing?

We know about legal music sharing and violating copyright by hosting MP3 files on our hosting server. We are providing HTML5 MP3 Music/Audio Player with Flash fallback to listen MP3 music to our customers/users. The customers are purchasing HTML5 MP3 Player with playlist not music.
We are not selling or hosting or uploading copyrighted or unlicensed music on our hosting server…….

HTML5 MP3 Players

The autoplay option does not work on Apple iOS mobile devices (iPhone, iPad, iPod) because Apple specifically prohibits it. Basically, iOS devices requires actual user interaction (physical touch) to start play Audio / Video Players.

According to Apple documentation:

Controls are always supplied during fullscreen playback on iPhone and iPod touch, and the placeholder allows the user to initiate fullscreen playback. On the desktop or iPad, you must either include the controls attribute or provide playback controls using JavaScript. It is especially important to provide user controls on iPad because autoplay is disabled to prevent unsolicited cellular download.

In Safari on iOS (for all devices, including iPad), where the user may be on a cellular network and be charged per data unit, preload and autoplay are disabled. No data is loaded until the user initiates it. This means the JavaScript play() and load() methods are also inactive until the user initiates playback, unless the play() or load() method is triggered by user action. In other words, a user-initiated Play button works, but an onLoad=”play()” event does not.

iOS-Specific Considerations

Browser & format support
With Flash as a fallback, it should work pretty much anywhere.
It has been verified to work across:
– Mobile Safari (iOS 3+)
– Android (2.2+, w/Flash), Android (4.0+)
– Safari (4+)
– Chrome (7+)
– Firefox (3+, w/ Flash)
– Opera (10+, w/ Flash)
– IE (6, 7, 8, w/ Flash)

Some Time JavaScript & Flash player cause issue on Windows XP + IE8 … please make sure you have latest Flash Player and No JavaScript Errors on Player Page …

if (!Date.now) {
Date.now = function() { return new Date().getTime(); };
}

var currentTime = Date.now() || +new Date();

HTML5 MP3 Player uses native <audio> where available and an invisible flash player to emulate <audio> for other browsers. It provides a consistent html player UI to all browsers which can be styled used standard css.

Browser & format support
With Flash as a fallback, it should work pretty much anywhere.
It has been verified to work across:
– Mobile Safari (iOS 3+)
– Android (2.2+, w/Flash), Android (4.0+)
– Safari (4+)
– Chrome (7+)
– Firefox (3+, w/ Flash)
– Opera (10+, w/ Flash)
– IE (6, 7, 8, w/ Flash)

If Radio Stream don’t have valid Radio Stream Codec Info then some Shoutcast Icecast mp3’s won’t play in html5 audio player

Please make sure you are using Valid Format Codec Radio Stream in HTML5 Radio Players

Best Codec, Sample Rate, Bitrate and Channel for Radio Icecast / Shoutcast Streaming

Standard Working Stream Info
Type: Audio
Codec: MPEG Audio layer 1/2/3 (mpga)
Channels: Stereo
Sample rate: 44100 Hz
Bitrate: 128 kb/s

Note: Icecast/Shoutcast MP3/AAC Radio stream must be 44100hz & 128kb/s stereo to work perfectly in players.

Other Stream Info
Type: Audio
Codec: MPEG Audio layer 1/2/3 (mpga)
Channels: Mono
Sample rate: 11025 Hz
Bitrate: 16 kb/s

There is a og:url tag in Facebook Open Graph Tags. If you know the parent page URL of the embedded content, you can set og:url parameter with the parent page URL. Then, it behaves like the way you share the parent page.

Facebook Share

<meta property=”og:type” content=”article”/>
<meta property=”og:title” content=”TITLE”/>
<meta property=”og:url” content=”URL”/>
<meta property=”og:image” content=”IMAGE”/>
<meta property=”og:description” content=”DESCRIPTION…”/>
<meta property=”og:site_name” content=”WEBSITE”/>
<meta property=”fb:app_id” content=”FB_APP_ID”/>

Song information is Ajax based process that will run every 5 mins

This is only one way to get song’s information in HTML5 based players 🙂

We can reduce Ajax request time to get updated information every 1 or 2 mins

You can review other html5 products, I will be here if you need my plugin

https://www.svnlabs.com/html5/radio-fm-stream/

Please try unicode mp3 links in XML file

Like:

http://server.com/mp3/បើសិនអូនជាសង្សារបង.mp3 (MP3 from any server or domain)

or

http://ip-address/audio/បើសិនអូនជាសង្សារបង.mp3 (MP3 from any server using IP Address)

I have tested on WordPress 3.4.1.

Its working fine for me

http://blog.svnlabs.com/work/wordpress-3-4-1/

If you are checking here http://wordpress.org/extend/plugins/html5-mp3-player-with-playlist/installation/

Free plugin is old .. new one is compatible with WordPress 3.4.1.

http://blog.svnlabs.com/work/wordpress-3-4-1/

Using this addon two or more players can be added on the same page or post.

1. Both full players
2. Small and Full Players
3. Both Small Players
4. Big and Small Players
5. Full and Big Players
6. Both Big Players

https://www.svnlabs.com/html5/multiple-players-on-same-page-using-shortcode/

Please check below javascript file link to auto play playlist

https://www.svnlabs.com/html5/audiojs/audio.js

settings: {
autoplay: true,

You need to update audio.js file in “wp-content/plugins/html5-mp3-player-with-playlist/html5/audiojs/”

OR

Add below statement in player file html5small.php, html5full.php or html5big.php on body load function 😉

$(‘.playing’).click(); //for autoplay

Please review … if you know HTML / CSS / PHP

https://www.svnlabs.com/html5/html5-mp3-player-with-downloadable-playlist-option/

For download option you need to edit files here…

wp-content/plugins/html5-mp3-player-with-playlist/html5/html5full.php

wp-content/plugins/html5-mp3-player-with-playlist/html5/html5big.php

Find:

<li>
<a href=”#” data-src=”<?php echo $mp3s; ?>” title=”<?php echo $mp3t; ?>” class=”track-name” name=”<?php echo $mp3p; ?>”><?php echo $mp3t; ?></a>
<p class=”Title01″><?php echo $mp3a; ?></p>
</li>

Add above it:

<span style=”right:27px; position:absolute;”>&nbsp;&nbsp;<a href=”<?php echo $mp3s; ?>” download=”MyDown” style=”z-index:1000; position:absolute;” target=”_blank” title=”Download”><img src=”download.jpg” border=”0″ width=”17″ /></a></span>

Is it possible to play shoutcast internet radio streams with html5?

Add semicolon after shoutcast link 😉
http://yourdomain:port/;

How could I play a shoutcast/icecast stream using HTML5?

<!DOCTYPE html>
<audio controls src=”http://domain.com:8010/;”></audio>

Yes, You can adjust audio volume to custom level using javascript

defaultValue: 8,

Set defaultValue to custom value …

We are using that JavaScript statement in function

Paid Version:

1. Vertical playlist https://www.svnlabs.com/html5/vertical-playlist/
2. You can take backup your xml files becoz file will be hosted on your server
3. We will assist on skype for paid support
4. Paid version have fully customize link, text, images etc. using HTML5 and CSS
5. Paid plugin also support WordPress 3.5
6. Random/Shuffle mode in playlist

Addon: https://www.svnlabs.com/html5/multiple-players-on-same-page-using-shortcode/

Icecast Streaming Media Server

fsockopen() [function.fsockopen]: unable to connect to icecast-ip-address:port (Connection refused)

IceCast Stream
http://icecast-ip-address:port/stream
http://icecast-ip-address:port/live

You must contact to your icecast hosting support for IP, Port, Domain blocking 😉

Make sure you have icecast port opened on HTML5 MP3 Plugin server 😉

Now plugin users can create dynamic playlist using new plugin addon…

Addon need MP3 Folder link to read all mp3 files in any folder publicly accessed

Example: https://www.svnlabs.com/mp3/ https://www.svnlabs.com/songs/

HTML5 MP3 Player with Playlist addon can read private folders using PHP on same server 😉

Other plugin

HTML5 MP3 Player with Playlist for Feedburner

<?php

$s = ‘http://www.domain.com/songs/4 THE SICK – 13 – Because Of U featuring Evan Eleazer.mp3’;

$s = str_replace(” “, “%20”, $s);

// OR

$s = preg_replace(‘/ /i’, ‘%20’, $s);

echo $s;

?>

Output: http://www.domain.com/songs/4%20THE%20SICK%20-%2013%20-%20Because%20Of%20U%20featuring%20Evan%20Eleazer.mp3

HTML5 MP3 Player with Playlist can be used on different page and post using shortcodes: https://www.svnlabs.com/html5/shortcodes/

You need to create XML/RSS based playlist first

Small Player (No Playlist): [html5mp3small:ID]

Full Player (With Playlist): [html5mp3full:ID]

Here ID is identifier of playlist you created 😉

We have addon to read folder of mp3 files to create XML based playlist dynamically

HTML5 MP3 Player Folder Addon

Thanks

Paid version of HTML5 MP3 Player with Playlist have download feature in playlist.

You can customize MP3 downloads and can add buy now button near download link

https://www.svnlabs.com/html5/html5-mp3-player-with-downloadable-playlist-option/

We have another addon to customize color and size of HTML5 MP3 Player with Playlist that is CSS based.

HTML5 MP3 Playlist Player Custom Color Size

You can customize player to fit on your website using custome size and colors.

HTML5 MP3 Playlist Player Custom Color Size

HTML5 MP3 Playlist Player Custom Color Size Options

Sample Player

Question:

I need a quote for your players and I need to know the following:

The music will get intrupted if the page change in the same
website?
If yes, is it possible to stick it to all the pages and just keep
musics to play during the page change?
Is it able to add new songs from different pages by a click on
musics?
would you be interested to develop a player with more functionality?

Answer:

You need to use “Frames Website Template” for your page / website
http://blog.svnlabs.com/frames-website-template/

You can use any frame for HTML5 MP3 Player Plugin …

Question:

What I want to do is have 1 player on the page that can access multiple playlists that the end user can select from and play the applicable content. Is that possible?

Answer:

https://www.svnlabs.com/html5/faq/multiple-players-on-same-page-using-shortcode-addon/

Yes, We can create a new addon “Tabbed playlists in single player” for that 😉

The XML Playlist files for free version are hosted on https://www.svnlabs.com/html5/ in xml folder 😉
Like https://www.svnlabs.com/html5/xml/1347391361.xml ..

You will lose all XML files when you upgrade plugin from Free to Paid (Self Hosted) Version.
So, Please take backup for your old XML Playlist files from Free version.

You can download your old XML files hosted on server https://www.svnlabs.com/html5/ (If you know the name of XML files)

Using : https://www.svnlabs.com/html5/xml/XML-File-Name

Example: https://www.svnlabs.com/html5/xml/1347391361.xml

You can request us for lost XML Playlist Files if you know your playlist ID for Free Plugin 😉

Playlist ID : [html5mp3full:5259] or [html5mp3full:ID]

Thanks for purchase HTML5 Audio Player with Playlist

HTML5 MP3 Players

This a complete package for HTML5 MP3 XML based playlist player

1. Copy / Upload “html5” folder to joomla root where “configuration.php” located.

2. Make sure folder “html5/xml” is writeable.

3. Upload / Install “html5mp3playlist.zip”.

4. Replace “https://www.svnlabs.com/html5” with your “http://www.domain.com” where joomla installed.

“plugins/content/html5mp3playlist/html5mp3playlist.xml” => Approx Line # 21
“plugins/content/html5mp3playlist/html5mp3playlist.php” => Approx Line # 68, 72, 76, 80

5. Activate Plugin “Content – HTML5 MP3 Player with Playlist”.

6. Create XML based playlist from joomla Extensions > Plug-in Manager > Content – HTML5 MP3 Player with Playlist.

7. Copy & Paste shortcode to joomla article editor.

{html5mp3playlist id=1 type=full}{/html5mp3playlist} OR {html5mp3playlist id=1 type=small}{/html5mp3playlist}

Support Email: [email protected]

Embed Code Button in HTML5 MP3 Player

Iframe based Embed code text area to copy code

Original Player

Re-sized Player

Use below code

<div style=”-moz-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -webkit-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -o-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -ms-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); clear:both; float:left;”><iframe src=”http://html5player.svnlabs.com/v1/html5full.html?id=276″ height=”227″ width=”586″ frameborder=”0″ marginwidth=”0″ marginheight=”0″ scrolling=”no”></iframe></div>

Div Style

style=”-moz-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -webkit-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -o-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); -ms-transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); transform: scale(.8) rotate(0deg) translateX(-40px) translateY(0px) skewX(0deg) skewY(0deg); clear:both; float:left;”

You can use suitable scale(.8) parameter to resize player on webpage 🙂
i.e. scale(.8), scale(.67), scale(.5) etc.

http://yourdomain.com/audiojs/audiojs.swf?playerInstance=audiojs.instances[%27audiojs0%27]&datetime=1382426114401.4087

Solution:

Just replace code (Original audio.js)

flashSource: ‘\
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ id=”$1″ width=”1″ height=”1″ name=”$1″ style=”position: absolute; left: -1px;”> \
<param name=”movie” value=”$2?playerInstance=’+audiojs+’.instances[\’$1\’]&datetime=$3″> \
<param name=”allowscriptaccess” value=”always”> \
<embed name=”$1″ src=”$2?playerInstance=’+audiojs+’.instances[\’$1\’]&datetime=$3″ width=”1″ height=”1″ allowscriptaccess=”always”> \
</object>’,

with

flashSource: ‘\
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ id=”$1″ width=”1″ height=”1″ name=”$1″ style=”position: absolute; left: -1px;”> \
<param name=”movie” value=”$2?playerInstance=’+audiojs+’.instances[&quot;$1&quot;]&datetime=$3″> \
<param name=”allowscriptaccess” value=”always”> \
<embed name=”$1″ src=”$2?playerInstance=’+audiojs+’.instances[&quot;$1&quot;]&datetime=$3″ width=”1″ height=”1″ allowscriptaccess=”always”> \
</object>’,

This is not permission (0755 or 0777) error of SWF file, Make sure you have valid characters on some browsers…

instances[\’$1\’] => instances[&quot;$1&quot;] 😉