Mp3 and video player
By 
Squark
You may want to consider an easier way to do this: MP3, Video
Description
I have used a well-known "hack" of html scripting, submitted by 
Helmuti_pdorf to insert mp3 and video player on my own website, so it can play the files I have uploaded to a page on Wikidot.
How to do it?
- For mp3 player go to the http://www.squark.wikidot.com/dev:8 and download attached files (swf and js)
- For video player go to the http://www.squark.wikidot.com/dev:9 and download attached files (swf and js)
- Upload those files on your page and also and also upload media files (mp3 for mp3 player and flv for video player).
- Add this code to your page:
Code
Mp3 player
[[code type="html"]] <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Squark mp3 Player</title> </head> <body> <script language="JavaScript" src="http://squark.wdfiles.com/local--files/dev:8/audio-player.js"></script> <object type="application/x-shockwave-flash" data="http://squark.wdfiles.com/local--files/dev:8/player.swf" id="audioplayer1" height="24" width="290"> <param name="movie" value="http://squark.wdfiles.com/local--files/dev:8/player.swf"> <param name="FlashVars" value="playerID=1&soundFile=http://squark.wdfiles.com/local--files/dev:8/1.mp3"> <param name="quality" value="high"> <param name="menu" value="false"> <param name="wmode" value="transparent"> </object> </body> </html> [[/code]] [[iframe http://squark.wikidot.com/dev:8/code/1 frameborder="0" scrolling="no" width="320px" height="40px"]]
Remember to change paths for swf, js files and your own mp3 file you have uploaded.
You can envelope code block by [[collapsible show=" " hide=" "]] ... [[/collapsible]] tags to hide it on your page.
Video player
[[code type="html"]] <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Squark mp3 Player</title> </head> <body> <p id='preview'>The player will show in this paragraph</p> <script type='text/javascript' src='http://squark.wdfiles.com/local--files/dev:9/swfobject.js'></script> <script type='text/javascript'> var s1 = new SWFObject('http://squark.wdfiles.com/local--files/dev:9/player.swf','player','400','300','9'); s1.addParam('allowfullscreen','true'); s1.addParam('allowscriptaccess','always'); s1.addParam('flashvars','file=http://squark.wdfiles.com/local--files/dev:9/video.flv'); s1.write('preview'); </script> </body> </html> [[/code]] [[iframe http://squark.wikidot.com/dev:9/code/1 frameborder="0" scrolling="no" height="320px" width="440px"]]
It's analogue to the mp3 player. Just change the absolute path of the swf, js and your own flv file you have uploaded.
In action
Mp3 player
Video player
For more information refer to:
- http://www.squark.wikidot.com/dev:8 and http://www.squark.wikidot.com/dev:9 — you can check the code if something in unclear
- http://www.macloo.com/examples/audio_player/ — used mp3 player
- http://www.jeroenwijering.com/?item=JW_FLV_Player — used video player
Rate this solution
If you think this solution is useful — rate it up! Or dump it otherwise.
page_revision: 6, last_edited: 1254665594|%e %b %Y, %H:%M %Z (%O ago)
append
to the flashVars param to get the song autoplaying.
Piotr Gabryjeluk
visit my blog
i need help!
i will be inactive until the winter holidays because of school — Rhombus p.
Where and for what?
Service is my success. My webtips:www.blender.org, www.zusi.de (Demo-Video)
Wollen Sie Wikidot helfen im deutschen » Handbuch ?
i need help to
i don't get what to change and what to change it to. i also don't get were to put the code.
i will be inactive until the winter holidays because of school — Rhombus p.
I think this iwll explain how this was done with the html trick
Hope this helps !
Service is my success. My webtips:www.blender.org, www.zusi.de (Demo-Video)
Wollen Sie Wikidot helfen im deutschen » Handbuch ?
okay, it still doesn't work, all it does is show a little box with the top part of the code in it. HEREis the link to the page that i have it on, and at the bottom i have the code to the page, please tell me what i'm doing wrong.
i will be inactive until the winter holidays because of school — Rhombus p.
got it working! i dont know what i did though. it was not working so i gave up and did something else, then i came back about an hour later and it worked, and i didn't even have to do anything
i will be inactive until the winter holidays because of school — Rhombus p.
Where is it running?
The code at your pasge IS NOT with [[code type="html"]] ( as I can see in your code block…)
Therefore the iframe cannot find / use the stored code with the sequence number 1
Where us it running?
Service is my success. My webtips:www.blender.org, www.zusi.de (Demo-Video)
Wollen Sie Wikidot helfen im deutschen » Handbuch ?
it was working for about 2 hours and now its not again
so i need to put it in a [[code type="html"]] block instead of just a [[code]] block?
also, i put the code of the page back up in case that helps you figure out my problem at all.
EDIT: its working now. i changed the code type to html and its working! if you dont see anything, try logging out and logging back in, that (for some reason) allowed me to see it
i will be inactive until the winter holidays because of school — Rhombus p.
I have problems accessing the squark.pl website??
I says
:(
Try squark.wikidot.com
Piotr Gabryjeluk
visit my blog
Cool I found it!
thanks again
Hello, I'm having problems with the details of this code. I've uploaded the files and an mp3 but can't get the player to work. Could you look at it and see what's wrong?
http://panzon.wikidot.com/new-projects
I go to your page - where is the iframe using this code?
(the last line of the code in the snippet…)
EDIT: Now I see it in IE (7) !
EDIT2: Now I can see it with view source … Sorry, forget this point.
But the iframe I cannot see working in FF(2) ! ( the theme ?)
Service is my success. My webtips:www.blender.org, www.zusi.de (Demo-Video)
Wollen Sie Wikidot helfen im deutschen » Handbuch ?
1. 2 of the 3 links to the files are not local—files but local-files…( only one hyphen)
2. Coud be this is my browser I see in FF (2) no iframe !
Only in IE (7) - seems to be the used theme - you should change it to another clear one for tests!
3. in IE(7) the swf file of Squark is working , but no tone get out :)
Service is my success. My webtips:www.blender.org, www.zusi.de (Demo-Video)
Wollen Sie Wikidot helfen im deutschen » Handbuch ?
Well, I seem to have the player working, it's just I can't get it to play the songs - It spends a large amount of time buffering - I've waited 10 minutes and the song hasn't buffered…
Help?
-XIronManX
For people that can't get this to work after you have uploaded the required 2 files and uploaded the music file and have the code above on the page:
Instead, make sure that it is referencing your page with all the code in the code block.
The key here is that you pay attention to the following: /code/1
You need to understand that you put this on the end of the page url for the iframe. /code/1 says to execute the FIRST code block on the page for the music file. You could put another number like 2 if you want to execute the second code block which has a different audio file reference.
I was having problems because I didn't realize that /code/1 was able to execute code block code.
hello, can you please help me insert my song playlist into my page.
please help me. here's the code that i made from www.imeem.com
<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://counters.gigya.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEyNDU1MzkyOTM3ODEmcHQ9MTI*NTUzOTMwOTAzMSZwPTE4MDMxJmQ9Jmc9MSZ*PSZvPTAwOTJlYTljNWY2NTQxNmNiOTM2MmY3N2E4MmJhYzlj.gif" /><center><p style="visibility:visible;"><object type="application/x-shockwave-flash" data="http://assets.myflashfetish.com/swf/mp3/mixpod.swf" height="311" width="410" style="width:410px;height:311px"><param name="movie" value="http://assets.myflashfetish.com/swf/mp3/mixpod.swf" /><param name="quality" value="high" /><param name="scale" value="noscale" /><param name="salign" value="TL" /><param name="wmode" value="transparent"/><param name="flashvars" value="myid=23833134&path=2009/06/20&mycolor=222222&mycolor2=77ADD1&mycolor3=FFFFFF&autoplay=true&rand=0&f=4&vol=100&pat=0&grad=false&ow=410&oh=311"/></object><br><a href="http://www.mixpod.com/playlist/23833134"><img src="http://assets.myflashfetish.com/images/btn-get-tracks.gif" alt="Music" title="Get Music Tracks!" border="0"></a><a href="http://www.mixpod.com" target="_blank"><img src="http://assets.myflashfetish.com/images/btn-create.gif" alt="Playlist" title="Create Your Free Playlist!" border=0></a><a href="http://www.mixpod.com/ringtones/23833134"><img src="http://assets.myflashfetish.com/images/btn-get-ringtones.gif" alt="Ringtones" title="Get Ringtones From This Playlist!" border="0"></a><br />Create a <a href="http://mixpod.com">MySpace Music</a> <a href="http://mixpod.com">Playlist</a> at <a href="http://mixpod.com">MixPod.com</a></p></center>
Try using the iFrame code: http://snippets.wikidot.com/code:include-any-page
You create a html page that has the music working (using the code you posted) and upload the html file to your wikidot site. Then you use the iFrame code so it appears on the front of your site.
In the example for the audio, when you click on the play button, is says "The Perfect Circle" How can this be defined? I can't see where to do this!
It's not defined. The player takes the ID3 tag from the mp3 file to create the Title and Name of the song.
my blog
squarkDesign - grafika komputerowa
rTechnologies - strony www
Thanks for that. :)