Keyword

Change audio player skin

  • giraffe
  • giraffe's Avatar Topic Author
  • Offline
  • New Member
More
13 years 11 months ago #40567 by giraffe
Change audio player skin was created by giraffe
Hello,

is it possible to change the skin for the audio player? The one provided looks pretty boring and I'd like to change the style if possible.

I'm talking about the one called player.swf in the players/mediaplayer/ folder.

Regards,

James

Please Log in or Create an account to join the conversation.

More
13 years 8 months ago #40568 by vcantante
Replied by vcantante on topic Re: Change audio player skin
YES, can anyone PLEASE share how can we change the sking?  or just only change player with another one?

vcantante

Please Log in or Create an account to join the conversation.

More
13 years 8 months ago #40569 by c22sail
Replied by c22sail on topic Re: Change audio player skin
I have done this on my site, using Joomla 1.7 and All Videos for Joomla 1.7. It isn't hard but I don't think it was how it was intended. You can go to JW Player and search skins. Find one you like that works with the version of player you have. Download the zip file.

Let's say you have a new skin called myskin.zip.

Copy myskin.zip to:

/plugins/content/jw_allvideos/jw_allvideos/includes/js/mediaplayer/skins

Note: you are copying the zip file as it is. You do not need to unzip it. JW PLayer reads right from the zip file. You can go into that zip and change the colors of elements to your liking, just save it all back as a zip when you are finished.

Go to /plugins/content/jw_allvideos/jw_allvideos/includes and download the sources.php file. You can edit this in an editor like Dreamweaver or a simple text editor like notepad.
There are two lines that have the following:

skin': '{PLUGIN_PATH}/includes/js/mediaplayer/skins/{PLAYER_SKIN}/{PLAYER_SKIN}.zip'

Change this lines to:

skin': '{PLUGIN_PATH}/includes/js/mediaplayer/skins/myskin.zip'

Save sources.php and copy back to its location.

I don't think that is the right way, but I could not get it to work any other way. I know there is a template file for our use but could not get it work for me.

Please Log in or Create an account to join the conversation.

More
13 years 8 months ago #40570 by vcantante
Replied by vcantante on topic Re: Change audio player skin
i tell you whaqt i do to change my skins to work in k2

First install Jxtc All videos and dont activate
Second intall all videos reloaded and activate.

then follow the steps to change the skins in AVR,  o dont know why k2 work in that gotm. but work same that allvideos. i can upload, and play  videos and audios.

Please Log in or Create an account to join the conversation.

More
13 years 8 months ago #40571 by c22sail
Replied by c22sail on topic Re: Change audio player skin
sorry - I wrote faster than I read. My fix is for the video skins and you were asking about audio. Haven't done that.

Please Log in or Create an account to join the conversation.

More
13 years 8 months ago #40572 by vcantante
Replied by vcantante on topic Re: Change audio player skin
its the same thing.  for audio and for video its the same skin, even o duplicate the player and the script to change the skin for both.

Please Log in or Create an account to join the conversation.

More
13 years 8 months ago #40573 by c22sail
Replied by c22sail on topic Re: Change audio player skin
yes you are correct. I just did a quick {mp3}mymusic{/mp3} and the audio player had the new skin.

Please Log in or Create an account to join the conversation.

More
13 years 8 months ago #40574 by c22sail
Replied by c22sail on topic Re: Change audio player skin
Hi all,

I have done more work on changing skins and I believe I have a better way than I described previously. It is a bit more complex, but it follows the concept of the All Videos format. The way I described worked well until I figured out how to remove the Menu button. When I did that, the audio player did not have the same skin when I viewed in IE9. It was ok in Firefox. What I am going to describe here works both in Firefox and IE9 and will still be clean if you remove the Menu icon.

In the first version I had you modify two lines in sources.php. In this version you do not need to modify sources.php, but you will modify one word in another file.

First - we need to look at how All Videos has there default skin setup.

This is found in /plugins/content/jw_allvideos/jw_allvideos/includes/js/mediaplayer/skins

Here you will find a folder called bekle. This is the default skin they are using and available from the skins download page at JW Player. What we need to do is copy our desired skin to the same location. For example, I have a new skin called myskin. I make a folder called myskin. Now there should be two folders, the original berkle and myskin.

Open All Videos Bekle folder up and note how it is laid out. There is a zip file, and the zip file has also been expanded so that all of the folders and files that are in the zip.

So here is what we have inside the bekle folder:

folder - controlbar
folder - display
folder - dock
folder - hd
folder - playlist
file - bekle.xml
file - bekle.zip

You will want to have the same folders and files for your new skin. So in the folder myskin we would see:

folder - controlbar
folder - display
folder - dock
folder - hd
folder - playlist
file - myskin.xml
file - myskin.zip

Now you are ready to switch over to your new skin.

Go to /plugins/content/jw_allvideos. You will find a file called jw_allvideos.php. I always make a backup of the file so I can get back to it if necessary.

You need to edit jw_allvideos.php. If you are using Dreamweaver this is about line 80. You are looking for the line that says:

$skin = 'bekle';

Change it to:

$skin = 'myskin';

This came out much cleaner for me and did not cause me grief with the mp3 player when I used my initial way.

Remeber - if you already modified sources.php as I described in my first method, you will want to put back the original sources.php from All Videos.

Now about that MENU icon - I have that information posted in another topic.

Please Log in or Create an account to join the conversation.


Powered by Kunena Forum