JWPlayer 6 in Wordpress 4.4 doesn't work with Firefox & Safari
I use JWPlayer 6 in my Wordpress 4.4 (latest version) -- audio only -- and while it seems to work fine in Chrome and Explorer, not so much in Firefox and Safari.
In Firefox, only the first two seconds are played before it cuts off.
In Safari, you can only control the 'play' button, not scroll through the stream.
Should I update to JWP7 to fix this? If so, how? There is no "update" option in the JWPlayer settings area.
The audio players on your page look like they’re setup with MediaElement.js and not with JW Player. I see how you have jwplayer.js embedded on the page, but I do not see instances of the player anywhere.
What I do is that I upload the file to my media library, then I get the option to "insert with JWPlayer". I press that and a code is added to the document. Something like:
[jwplayer mediaid="589"]
I then type [audio] in front and [/audio] after to make the bar the full length of the page.
I understand, thanks. I use the 'audio' tag because it looks neater on the page, filling out the whole page (whereas JWPlayer has a much shorter bar). But perhaps there's some way to "stretch out" JWPlayer to look similar?
Interestingly, I tried to remove the [audio] tags now, and the whole player disappeared. There's nothing there!
In either case, does this explain why Firefox users (and to a certain extent, Safari users) have issues with the playback?
OK, so I first need to get JWPlayer to work, and then I'll doublecheck the Firefox/Safari thing
Anyway, I tried to re-insert the media from the library using 'Insert as JWPlayer', but it still comes up completely blank on the page. No player at all visible (unless I add those wicked [audio] tags, but then it's JWPlayer anymore). Weird.
I think I may know what the issue is. Is your player rendering in Flash or HTML5? You can verify this by going inside of your Wordpress Admin, going to JW Player > Player Management > click on “Edit” for your player" and look under “Default Rendering Mode”.
If it is set to Flash, the player may not appear in Chrome because they automatically block Flash content of a certain size.
Yeah, I have two options there -- "Default and fallback player (unremovable)." and "Audio Only". I guess it's the "Audio Only" which is relevant for me.
In both cases, it's set to Flash. Do I change it to HTML5?
Yes, I put the Wordpress player back after I created the screenshots. But you can check again now -- I've reinserted the JWPlayer that results in a blank space.
There are no error notifications in the browser's console when the issue occurs.
I went into my test Wordpress Instance and tried embedding a player the same size of yours and it’s showing up fine. I would suggest the following:
1. Can you delete the plugin from your Wordpress instance and then re-download and install it again? You can click this link to download the JW 6 Wordpress plugin.
2. If it still does not work, can you send me screenshots of your Plugin Settings and Player Management screens for the plugin in your Wordpress Admin?
It looks like, from the first screenshot you sent, that you don’t have a license key inputted in your Plugin Settings. Even though you have a “Free” account, you still have a license key that ties the player to your account. To get the key, just login to your Account Dashboard (http://account.jwplayer.com), click on the “License Keys & Downloads” link towards the middle of the page, and copy and paste the license key for JW Player 6 (Self-Hosted) into that field in your Wordpress Admin.
The option would not be in your Wordpress admin area. You would want to do the following:
1. Go to https://wordpress.org/plugins/jw-player/ and download the plugin.
2. Extract the downloaded ZIP file and copy the jw-player folder to your wp-content/plugins directory of your Wordpress installation.
3. In your Wordpress Admin, go to Plugins > Installed Plugins, if you are not on that page already.
4. Activate the plugin.
5. Go to Settings > JW Player.
6. You will see an option to insert your API Key and Secret. You can find these by logging into your JW Player Account Dashboard, going to Account > Properties.
The plugin should then be set up. It ties into your Account Dashboard so you would want to configure your players on the Dashboard, instead of in Wordpress like you’re used to. You would also want to either host your content with us, or add external content via URL on the Content page of your Account Dashboard.
Please note, however, that since you have a free account, you are limited to uploading 5GB of content to our server and streaming 25GB of content per month. If you are hosting your media outside of JW Player, then those limits do not pertain to you.
Please let me know if you need any more help or have any other questions.
My content is hosted in a different server, and it's not ideal to configure my player outside the Wordpress interface, but if that's what I got to do, that's what I got to do.
It looks a bit weird, and not as slick as the Wordpress player (it doesn't fill out the page's horizontal length, and the top seems to have been cut off), but at least it's something there. Plus uploading new episodes will be rather complicated from now on.
BUT. It will have to do for now. Thanks for the help.
Now comes the next issue -- and the purpose of this thread in the first place. Will it work properly with Firefox, Safari etc.?
If you change the player’s height to 40, it would display properly.
As for playback in Firefox and Safari – it’s working fine for me in Safari but isn’t in Firefox. I see that you’re pointing to the file you uploaded to Wordpress, can you try uploading it to our platform and try again. Your MP3 worked fine for me when I uploaded it to my dashboard.
I played around with this a little bit and found that you do have to add the media to your JW Player account, but you don’t have to upload it. You can just add the URL either through the JW Player dashboard or by clicking the “Add the URL” link on the bottom of the dialog in Wordpress you use to embed JW Player. I just tested this with Firefox and it worked for me.
Also, at the moment, neither of the two -- neither the uploaded or the "pointing-to-content" episode -- play in Safari at all. I tested Safari on my iPhone as well my PC. I do not have a Mac.
It’s weird because sometimes I see your issue in Firefox or Safari (for Mac or iOS), but sometimes I do not. I’m curious – can you try creating a test page and embedding the MP3 with the normal Wordpress plugin and see if the same issue happens?
Yes, a test page on your site. You can see our support article about how to create a test page here: https://support.jwplayer.com/customer/en/portal/articles/2186238-troubleshooting-%E2%80%94-creating-a-reproduction-page
I just tried your test page on Chrome on Mac, and I’m having issues with both players. With the JW Player, the first couple times I tried to play the content, it would just not play and the play button will revert back to Play. After a few times, the JW Player will play the first two seconds and then stop. I’ve tried the Wordpress player both times and it’s not working.
At this point, I’m thinking it’s an issue with the MP3 itself. Can you try uploading and doing the same embedding technique with a sample MP3 found on this page: http://www.noiseaddicts.com/free-samples-mp3/
Really? Chrome works fine on my PC (both players). Only Firefox and Safari have issues.
I doubt it's something with the mp3. All my mp3s are the same and I've never had any issues before. This is only an issue that has arisen in the last month or so.
I'd love to upload an mp3 sample from that page, but there is no download option. It only streams the sound. However, I've uploaded a new mp3 in a new JWPlayer and a new Wordpress player at the test page. You can check it out now, and see if the problem persists.
You should be able to download the MP3s when they start playing by right-clicking on the player and choosing Save As..
As for your new MP3, I’ve tried it and the browser console is reporting a media error for it. I also tried the MP3 directly in the browser and it fails to play natively in Chrome. (http://celluloidtunes.no/wp-content/uploads/2016/01/03-Touchy.mp3)
Again, the new mp3 plays fine here (also natively in my Chrome), so perhaps there is a difference between our "Chromes"? Have you tried them in Firefox and Safari?
I tried downloading by right-clicking etc. earlier, but it only wants to download the webpage (html), not the mp3.
Of course, the next time I try your test page in Chrome, it works and the media plays. :)
It’s also playing for me in Firefox, but not in Safari.
I downloaded your 03-Touchy.mp3 and uploaded it to my Wordpress and embedded it the same way you did – added the URL to my account dashboard, then embedded it with our new plugin – and it works fine for me in all browsers, including Safari.
At this point, I’m not sure how else I can troubleshoot this. I know one thing – it doesn’t look like it’s an issue with our player itself. I’m also not able to reproduce your issue in another Wordpress environment. I would suggest maybe removing some plugins or other JavaScript libraries you may have on your page to see if that does anything.
I see. Well, the answer is obviously somewhere in there (whether Wordpress or JWPlayer or something else) -- and it's something that mysteriously happened one month ago.
Anyways, I appreciate your help along the way. I'll try your tips about plug-ins, but if that doesn't work, I think I may have to go for a different player altogether.
This question has received the maximum number of answers.
