Hey everyone,

Could you please tell me how to add the amazing audio code into a RSD document I am still having trouble. I pasted the 1st section of code into the HEAD box under the settings tab and then I pasted the 2nd section of code in the HTML element. I added the folders created by Amazing Audio Player into the resources section of the RSD file and uploaded everything to my server but the player is not showing up. I contacted Coffee Cup and they looked at the page and said that it is showing an error
Uncaught TypeError: jQuery(...).amazingaudioplayer is not a function
at HTMLDocument.<anonymous> (initaudioplayer-1.js:9)
at j (jquery.js:2)
at Object.fireWith [as resolveWith] (jquery.js:2)
at Function.ready (jquery.js:2)
at HTMLDocument.J (jquery.js:2)
and I have to contact Amazing Audio which I can't figure out how to do. Just looking for someone who knows already how to make this work. I know it does.
My page is www.frickandfrackmusic.com/samplejukebox.html

Phillip,

It would be a good idea to post the URL to where you found that Amazing Audio player, as it might be unknown to many. This is a CoffeeCup forum, mainly for the CC programmes, but of course we also try helping people making 3rd party software work in a CC app.

You could try this. All you should need is the two .js files and the .css file. I would not add the jquery.js file as it will probably conflict with the jquery file RSD already loads in the footer.

Make sure the two other .js files are in your resources. I usually make a folder named js and add them there. I also make a folder named css and add any stylesheets there. This will then add these files inside the js and css folders RSD already creates on export keeping things tidy.

Now, in settings for your page go to the head and click "add resource" to link the .css file. Then do the same for the footer for the page settings. Click "add resource" for both the .js files. (Do not add the jquery.js file though.)

I think what is happening if you paste all that code in the head is its loading a old version of jquery, then loading the files, but then it reloads jquery again which may be why it does not play. I know there is a way to add a jquery no-conflict also that would prevent this but will leave that matter to the experts on this forum.

I am sorry but I'm a coding moron. Here are the instructions that Amazing Audio Player tells you to follow which I have done. All to no luck

https://amazingaudioplayer.com/how-to-a … r-webpage/

how about attaching the project file (zipped ) then we can have a better idea as to either what you have dome or what needs to be done more

Actually after getting home tonight I tried my suggestion and ran into problems. It seems the player works however I could not get the play button etc to appear. I noticed on adding amazing folders to resources that some files are .swf which "Do Not Import" by RSD so they get left behind.

A much easier way is to use the Iframe method. On their website visit the "How to insert an HTML5 audio player to your webpage using iframe".

You will have to upload the published folder that Amazing outputs directly to your site. Then open your RSD project and simply add a html element. Paste the iframe code they reference in to html element.



You then are requested to change the link to your audioplayer.html file that you uploaded directly in step one. You can also change the width and height. Thats it ! No adding any files or folders to RSD.....just iframe code into a html element.

Here is a link to a working example unstyled. http://gluexp.coffeecup.com/foundation/ … layer.html

I apologize, I gave the example link to the direct audio player itself.

Here is the link to RSD "with" the html element and iframe code. (In Foundation Framer)


http://gluexp.coffeecup.com/foundation/ … audio.html

Your script links are incorrect.

Change this


To this.


You may need to drop the first link to JQuery and only leave the css link in the head of the page and place the left over js scripts in the foot area.

The links to your mp3's are also in need of adjustment.
example
Change this

To this

Here is a very simple project file showing the settings Eric mentions.

It will work either way using either the iframe method or direct add to resources and link the css file and (2) js files.

I did try with and without the setting for force html5 (disable swf) but found no difference. I think I may have had a link to the wrong file in my previous attempt.

The Iframe method would allow one to update playlists outside of RSD easily if future additions to the skin or playlist were to be made.

Shout out to Geoff who had a nice site that used the html5 player. Very cool too....