Playing Videos in SharePoint using JWPlayer

Requirement:  To play a .MOV video file in SharePoint site.

Solution: Used the JWPlayer in SharePoint. Here are the detailed steps.

Step 1: 
Download the JWPlayer files from https://www.longtailvideo.com/jw/upload/mediaplayer-viral.zip
Extract and open the jwplayer.js file, Search for  /jwplayer/player.swf and then replace this with the location where you are going to upload the files.
E.g. change it to:

https://SharePoint.yourcompany.com/sites/Marketing/brandcenter/Player/player.swf

Step 2:
Create a Document Library and upload the files along with your video file and modified preview.png.

jw player sharepoint

Step 3:
Create a HTM file with the name of “Jwplayer.htm”, paste the below code in it, change the File locations accordingly,  and then upload it to the document library you created earlier.

<html>
<head>
<title></title>
</head>
<body>
 <!-- START OF THE PLAYER EMBEDDING TO COPY-PASTE -->
 <div id="mediaplayer">Loading video...</div>
 
 <script type="text/javascript" src="https://SharePoint.com/sites/Marketing/brandcenter/Player/jwplayer.js"></script>
 <script type="text/javascript">
  jwplayer("mediaplayer").setup({
   flashplayer: "https://SharePoint.com/sites/Marketing/brandcenter/Player/player.swf",
   file: "https://SharePoint.com/sites/Marketing/brandcenter/Player/bp.mov",
   image: "https://SharePoint.com/sites/Marketing/brandcenter/Player/preview.png"
  });
 </script>
 <!-- END OF THE PLAYER EMBEDDING -->

</body>
</html>

Step 5: Now add a content editor web part, Edit the CEWP and point it to the HTM file created. Or Place this code:

<iframe name="Iframe" src="https://SharePoint.com/sites/Marketing/brandcenter/Player/Jwplayer.htm" scrolling="no" FRAMEBORDER="0" style="width:100%; border:0;  height:100%; overflow:hidden;">
</iframe>

See it in action!

jwplayer for sharepoint 2010

Look at this post for web based players: https://www.instantshift.com/2010/05/14/21-free-video-players-for-your-website-and-blogs/

we can use the EMBED tag as well!

<div>
<embed src="https:/SharePoint.com/marketing/brandcenter/player/bp.mov" autoplay="true" loop="true" width="400"      height="200">
 </embed>
</div>

The Problem here is: you must have a browser plug-in installed to play the video ( Such as Quick time) also it will prompt for username/password when using Secured sites.

Salaudeen Rajack

Salaudeen Rajack - SharePoint Expert with Two decades of SharePoint Experience. Love to Share my knowledge and experience with the SharePoint community, through real-time articles!

7 thoughts on “Playing Videos in SharePoint using JWPlayer

  • I’ve tried the above and can get the video to play directly from the jwplayer.htm file, but when embedding it either in a CEWP or a Page Viewer Web Part, it always tries to download jwplayer.htm instead of showing it. Am I doing something wrong?

    Reply
    • Fowler, You have to either set the browser file handling or MIME type. Follow this article: https://www.sharepointdiary.com/2011/04/open-pdf-document-browser-sharepoint2010.html

      Regards,
      Sal

      Reply
  • It only shows “Loading Video….”
    Any suggestion? Thanks

    Reply
    • Try opening the HTML file you created in Browser first. If that HTML still shows “Loading Video” you may have to check any mistyped URLs, Javascript Link, Video Links.

      Reply
  • I performed the steps mentioned above but my Content Editor says
    “Cannot retrieve the URL specified in the Content Link property. For more assistance, contact your site administrator.”
    any suggestions

    Reply
    • Check these two possibilities:
      1. Resource Links(such as video, javascript) are mistyped – Try absolute URL.
      2. Permission issue.

      Reply

Leave a Reply

Your email address will not be published. Required fields are marked *