Using JW Player, WordPress, Amazon S3 & Youtube

Using JW Player, WordPress, Amazon S3 & Youtube

Posted on 26. Jun, 2011 by in JW Player, Members Only

I love JW Player, by Long Tail Video, for my WordPress Blog.  One of the main reasons I like JW Player is because they are implementing HTML 5 support – which means I can add video’s to my website (in MP4 format) and have the videos display on my website and iDevices (iPhone, iPod and iPad).

The other thing I really like, is the way the media management has been implemented into the WordPress Media Library – making inserting videos from Amazon S3, Youtube and other sites outside your WordPress website really easy.

These three videos demonstrate how easy it is to install and use.

Installing and Configuring JW Player

Using JW Player to Display a video hosted on Amazon S3

Displaying a Youtube Video With JW Player

Tags: , ,

   Clip to Evernote   Subscribe to It!

Charly Leetham is a Small Business Coach and Online Business Implementation Expert and I help small businesses take their business online. I provide services to solopreneurs and small business who wish to sell or promote their products and services online.
Online Business Implementation Expert

  • http://www.the-music-ministry-coach.com Ron

    Hi Charity, I had a problem viewing your second and third video. I get an error on both of them. Looks like the error is coming from Amazon and actually showing your access Id key. Just a heads up.

    Ron

    • http://askcharlyleetham.com Charly Leetham

      Hi Ron,
      Thanks for the heads up, I just tested the last two videos in two different browsers and they play as expected – would you mind checking again?

  • Michael

    Hi Charley,

    I’ve tried implementing as per 2nd video and cannot get it to play. Did you set up a Cloudfront distribution?

    Michael

    • http://askcharlyleetham.com Charly Leetham

      Hi Michael,
      I haven’t done anything particularly special. I use AMAZON S3 distribution, not cloudfront.
      When you say it doesn’t play, what happens? Nothing, or do you get an error?
      Feel free to post a link to the page with the issues and we’ll see if we can help.
      Charly.

  • Eric

    Hello Charly,
    Any idea why when I add a video from my S3 to my blog, I get the thumbnail photo fine, the video starts with audio but I only have a black screen in the JW player?  It’s a blank black screen the entire video.  Thanks.  I have gone through the instructions a few times and I don’t think I am missing anything.

    • http://askcharlyleetham.com Charly Leetham

      Hi Eric,
      Are you getting any sound at all?
      Typically, the black screen is an encoding issue. I don’t really understand the whole ins and outs of it, and I’m sure there’s a video technoboffin who can explain it in more detail.

      I use Camtasia and AnyDVD Convertor as my two main video production tools and haven’t had any issues – but I have had clients who have created videos and experienced the ‘black’ screen.

      The last time we addressed this, we found this tutorial to be very helpful in resolving the issues:
      http://www.miracletutorials.com/converting-video-tutorials-to-streaming-mp4-for-s3-amazon-using-avs-video-converter/

      One final note – some video convertors will put the “indexing” marker right near the end of the video. This means that the video has to nearly fully download before it will start playing. If you find that your video is just downloading and not playing after a couple of seconds (or less), you need to move the index marker. I’ve used YAMB (http://yamb.unite-video.com/) quite successfully to do this. It doesn’t mess with the video encoding at all, just moves the index marker to the front of the video, so once it starts downloading, the computer gets the “start playing now” instruction sooner.

      HTH
      Charly.

      • Eric

        Hey Charly,

        Thanks, it worked great!  I recorded the video with Camtasia and changed the indexing.  I’m not sure what fixed it, but it did.  I will just record the same way now in the future.  Thanks!

        Eric

  • Thomas Colvin

    Charly, I have a blog that over a year old, with lots of YouTube video already in it.  I am about to dramatically upgrade my site and plan to add S3 streaming and the JW Player.  Do I need to go back through all past posts and re-enter info into the JW Player — or will JW Player co-exist with my current player so that no updating of posts is necessary?

    THANKS for your posts.  Very helpful to me as I prepare to take this big plunge.

    • http://askcharlyleetham.com Charly Leetham

      Hi Thomas,

      I’ve used JW Player with a couple of other video plugins, without issue but there’s no such thing as a sure thing.  Some wordpress video plugins just conflict with each other – you will have to test it, but in the main, I’ve used two plugins on a few sitesw without issue.

      In a lot of cases, I have actually gone back through and updated the codes in my old posts to use the new shortcode, but it can be a lot of work… so I get that you may not want to do that.

      thanks for the lovely comment and I’m glad my posts have been helpful

    • http://askcharlyleetham.com Charly Leetham

      Hi Thomas,  I thought I had responded to your question but obviously not!  In general, most video players will co-exist with each other but you do need to check it out.

      I’ve used JW Player with two or three other plugins and haven’t had any issues.

  • Jimmi

    Hi Charly, Thanks for the videos. Very clear and easy to understand.

  • Slavica

    Hello Charly,
    thank you for the great videos.
    Keep up the great work.

  • http://twitter.com/9mmtylenol Jesse Watson

    GREAT VIDEO, I was looking forever to find the JW Player’s “insert into post” button. Sometimes you need a little nudge in the right direction. =D

    • http://askcharlyleetham.com Charly Leetham

      Hi Jesse – glad it helped.  I know exactly waht you mean by the nudge in the right direction.

  • Loretta

    WOW and HELP!  I came across your video on YouTube – it was the BEST for helping me set up JW Player.  Thanks, Charly!

    ***  BUT BUT BUT, when I embed, I can’t get my MP4 video to load in the player.  It tries, but takes forever…  I think I may need to re-encode it to stream better or something?????  I can’t find the answer. Looked everywhere, and am more confused than ever…

    ***   I just want to use Amazon S3, JW Player, and embed a 20-minute video on a wordpress page.

    What settings should I use to encode?  I have “Handbrake.”  I use a Mac.
    Oh, if someone, anyone could just help me!!!

    Please please please can anyone help???  I am kinda new at this and don’t know who to ask or what to do!  :-0  

    THANKS!!!  wolring[at]yahoo.com

    • http://askcharlyleetham.com Charly Leetham

      Hi Loretta!  Thank you for kudo’s.

      Yeah, encoding videos is normally the issue.  I’ve spent hours reviewing issues for some of my clients.

      I’m assuming that your video player shows the swirly thing that indicates that the video will start playing?  But it just shows the black screen – and if you wait long enough, it will eventually play.

      I’m not familiar with Handbrake – and only use a PC.

      Perhaps you could share a link to a video that isn’t working and we can take a look?
      And hopefully, MAC Users who also use Handbrake will chime in too!

      • Loretta

        GOT IT!  I worked on this day and night for DAYS.  Here’s the deal. People have to encode their MP4 videos so that their combined bitrate for audio and video does NOT exceed their viewers’ internet connection speed. So, let’s say your user of the lowest internet connection has a connection of 256 kbps.  You need to encode video around 200 and audio around 56 each for the bitrate settings.

        NEXT and most importantly, this thing called the “moov atom” has to go the FRONT of the video instead of the back – where it makes the video fully load before playing.  Moov atom is some indexing thing for the video.  Normally it’s at the end, but must go at the beginning in order to “stream” the video.  Some people use QTindexSwapper free software,  but if you use Handbrake, just checkmark the “web optimized” box to do this.

        Flash is becoming obsolete – because it does not play on many mobile devices, whereas mp4 formats play on almost anything.

        http://www.handbrake.fr has FREE video encoding software for both Mac AND PC.  It’s awesome and user-freindly.  Also lets you burn/copy your DVD’s, etc., nicely.

        I hope this helps everyone who may ask you similar questions!  I now have NO problems with my videos on JW Player and Amazon S3 and I don’t even use Cloudfront to optimize speed – although you could use that with A S3, to make video delivery even faster.

        Whew!  I really learned far more than I wanted to!

        -Loretta

  • James Reeves

    Thanks for the video tutorial Charly.  That’s just what I was looking for.  I don’t know why it was so hard to find this info. You made it easier to find this info than the developer did.  Keep up the good work.

    James Reeves

  • Anonymous

    Charly, what do you use to encode your mp4 for use with JWPlayer. The player will only play sound and it stays black

QR Code Business Card