Filefield + jQuery Media Screencast
- Pharmacology:
Here is a fast lesson on one of the many (many) ways of hosting and presenting video on your own Drupal website.
The CCK Filefield and jQuery Media modules are a one-two knockout combination that allow users to upload media files to fields in your custom content types and then play back the media files in the correct player or handler. It's a great replacement for the video module and integrates nicely with any modules that like to do things with fields.
Let this screenie get you started in only 13 minutes, and please drop me a line or leave comments if this is meaningful to you. Also note that the Boston Drupaltherapy workshop on July 25, 2008, is coming right up - if you are seeking excellent training this summer, this is a great opportunity.
This screencast was produced with great insight from Aaron Winborn. Aaron is publishing a book this summer, Drupal Multimedia, which talks about this recipe and many more.
In order to best understand this screencast you should have working knowledge of Drupal including the installation of contributed modules and exposure to the Content Construction Kit (CCK).
Comments
The tutorial is really
The tutorial is really excellent. I am newbie in drupal and I know certain post link this would help a lot in my CMS sites. Keep up the good work dude. This is one of the coolest things online.
i saw this video tutorial but
i saw this video tutorial but i still have two problems:
1. although i enabled jquery and jquery media and configure it as in the video tutorial but i still see the link of the uploaded file,
i download JW player on drupal project (\wamp\www\drupal-6.14\sites\all\modules\player\mediaplayer.swf) but nothing change.
another problem: i want to allow users to upload fiels so, i gave the permission to authinticated users to upload files but i cant see the upload field in the user account page.
Best regards
Great Video, thank you so
Great Video, thank you so much.
Excellent dude, im from Peru
Excellent dude, im from Peru and im makin a site with UberCart, Im a newbieein all Drupal stuff so although I didnt need the Media ScreenCast module, the info on CCK is very helpfull. Thankz Sean
Great! Really helpful video.
Great! Really helpful video.
thank you. you saved my life.
thank you. you saved my life.
Thank You Very much it is
Thank You Very much
it is very good and useful video
Syrian Drupal Developer
thanks sean!! how about a
thanks sean!! how about a therapy in toronto?!! :D
You should enable recaptcha
You should enable recaptcha module for comments.
I've just installed as per
I've just installed as per the instructions on drupal 6 and in Safari the media files (*.mov, *.mp4, *.wmv, *.avi) all just download to my downloads folder and open in Quicktime Player rather than playing in the browser. In Firefox they play OK. Tested on three different macs.
Sean: Thanks for the
Sean:
Thanks for the tutorial. I am a relative newbie to Drupal but not to CMS in general.
Had problems at first with file size. Searching Drupal.org gave the possible solutions as changing the .htacess to override php settings(did not work for me) or editing the php.ini file (This worked) On my host (HostMonster) I am able to place a copy of php.ini in the public_html folder so it can be edited. There are two settings in there that deal with file size. One is upload file size the other is post size. Don't remember exactly but search helped me find the variables I needed to change.
Next I missed the permissions for file field.
Uploaded an AVI file did not get window, tried with .wmv and worked fine. Guess there is no player in browser to play AVI. Will have to check on that, but I use mainly wmv anyway.
Only posted above to help others with similar problem.
Glad I found this site. I have a long way to go to get my video cooking site running on Drupal, but your vid helped a lot.
Pablo Maiorino
Thanks a lot for these very
Thanks a lot for these very helpful videos.
this helped me a LOT. Thank
this helped me a LOT. Thank you so much! :D
For some reason this recipe
For some reason this recipe doesn't work for me at all.
I am using drupal 6.12, and the Garland Theme (modified only the color set to Olivia instead of Blue Lagoon, that's it).
Then, here's the config:
1. jq-6.x-1.2
2. jquery_media-6.x-1.4-beta1
3. cck-6.x-2.2
4. filefield-6.x-3.0
5. JW Player 4.4 (latest)
I have thoroughly followed the turorial several times and configured the Jquery Media to use the player.swf which I placed in my sites/default/files directory.
I have also created the "video" content type, added the upload field, etc , etc ...
When I create content, I upload a test.mov file but after I click Save and want to view it, I am getting a blank page in FF (white with no header ..) it only displays :
Wed, 05/27/2009 - 11:24 — admin
In IE7 it gives me a 500 error.
Strange is that this is happening on my Linux Centos VPS.
I have another Drupal installation on my laptop and use MoWes as a local webserver. I tried it with local installtion too and the error is different.
I am gettin the movie somehow embedded, and it is not resized and I can't use the controls even though I suppose that if I could, it's still a quicktime movie, the player seems like it doesn't recognize it.
I found this Jquery solution after playing a bit with Flashvideo which I actually got working, but this seems better to me, even though it doesn't support thumbnails.
Thank you for any feedback.
Is your site in a
Is your site in a subdirectory? I had a problem like this, and I finally figured out that I need to configure the path to the JWplayer differently. Here's my example (using the same modules as you):
The domain to my site was something akin to www.example.org/site1
I put the mediaplayer directory(which was unzipped from JW player download) in my drupal6 folder.
In jquery_media I configured the path to the player as "mediaplayer/player.swf" - no luck - I got a big white box where there should have been media.
Using firebug I saw that the path to the player on the page was listed as "date='/site1/mediaplayer/player.swf?..etc.."
I went back to jquery_media and changed the path to the JWplayer to: "../mediaplayer/player.swf" - now it loads as it should.
This problem is similiar to the cleanURL problem with multisites in subdirectories - you have to add special rewrite rules for each site... took me forever to figure that out. :)
I hope this helps someone!
Best,
Evan
PS. Thank you for the great tutorials, Sean, you were my intro to Drupal media several months ago!
I tried this and it's still
I tried this and it's still not working for me, it just won't use the JW player and instead brings up the quicktime plugin. I even copied the player.swf file to every relevant directory I could think of just to test it.
Anyone got any other ideas?
JW player plays Flash video,
JW player plays Flash video, not quicktime mov files.
awesome! Thanks!
awesome! Thanks!
thank you very much sean!
thank you very much sean! this was a very helpful tutorial. do you know how i can put a poster frame (.jpg) as an overlay to a movie? i was able to play a movie (.flv) in drupal 6 per your tutorial but i could not figure out how to add the poster frame. i'm currently using:
1. jq-6.x-1.2
2. jquery_media-6.x-1.4-beta1
3. cck-6.x-2.2
4. filefield-6.x-3.0-rc1
and i'm using jw player 3.16.
thank much in advance for your help.
-paul
Thank you very much. As clear
Thank you very much. As clear and straightforward as it comes, as always.
Hello Sean, Great Screencasts
Hello Sean,
Great Screencasts :-)
I dont wanna Upload my Files on Youtube or Blip ...
Rather i wanna host my Video selfs!
Could you tell me how to implimentate the self Hosted
Videos on my Page? I only found stuff about Embedding.
Thanks
Josh
Josh, watch this:
Josh, watch this: http://www.drupaltherapy.com/node/50
Thank you for grate
Thank you for grate video.
File size is limited by filefield,
so i would like to know tha way to write
in URL or PATH at.
Any idea ?
I did a clean fresh drupal
I did a clean fresh drupal install with latest version of cck, filefield, jq, jquery media module but not work.
mp4 just show a link,
flv just show a video canvas area
Just as easy as useful! Thank
Just as easy as useful! Thank you very much!
Another really useful
Another really useful tutorial, thanks. Couldn't get SWFTools working for love nor money, but your way worked straight out of the box.
Thanks a ton! I have watched
Thanks a ton! I have watched nearly all of your screencasts and I sincerely appreciate the help.
Hi Sean! Excellent
Hi Sean!
Excellent screencast!
But I have one question: Is there a possibility to have different size settings for audio and video files. At the moment with the standard settings I have an area of e.g. 400x300px for audio files and I just need the control bar ...
Best regards,
Christian
Hi, .mov files play
Hi,
.mov files play correctly. .avi files do not play at all. the windows media player is loaded in the browser (both IE and Firefox) but when clicking play, nothing happens. any idea?
9yk5x3oux1izfihj
9yk5x3oux1izfihj
Hey Sean, Thank you for the
Hey Sean,
Thank you for the quick and informative screen cast! The way you presented it was complete and informative. Right after watching I downloaded the modules you suggested to give it a try with great joy and anticipation.
Now, I need therapy as filefiled forces PHP 5.2+. I'm running on a RedHat EL 5 server. The current level of PHP for this level of RHEL is 5.1.6 and there is no released code from RH to move to PHP 5.2. So it seems that your simple solution it driving a change at the os level that I do not have the ability to make. I recommended upgrading PHP to my hosting company -- they say they only support configurations of RHEL that RH supports.
Please don't get me wrong here. I think you are doing a great job with the screen cast -- it just doesn't work for me. It is really too bad that filefield is driving the need for PHP 5.2 ahead of RH delivering and supporting this level. It looks like I need another solution for playing an MP3 file that integrates with CCK and Views. Any ideas?
Thanks in advance for the therapy!! Greg
Greg, it's not just Filefield
Greg, it's not just Filefield that is driving the move to PHP 5.2, but the entire Drupal project! Drupal 7 will be a PHP 5.2 only release. Read here for more:
http://drupal.org/gophp5
I would recommend you consider moving hosts to a company that can see the future. Unfortunately, moving hosts is a crappy job but we have come to accept this as part of the lifestyle, read here:
http://drupaltherapy.com/node/53
Hi I have jq media and JW
Hi
I have jq media and JW Player working fine with one filefield cck flv, however, the formating is howfull with an icon of the file and a name. Another problem I have is how to put two or more files in a filefields and showing them up in the player with a playlist. The only problem I see is I can't set two files to open in JW Player and xspf playlist doesn't work eather, as xspf_node_playlist has an installation erron on line 55. How can one integrate JQuery Media with CCK and set JW Player to show up with a playlist of files in the same node.
Things get worst when a user has or wants to put a video in a percise place.
How about a tutorial on that?
Thanks in advance.
Nuno Ribeiro
As far as I know, multiple
As far as I know, multiple files in the same field are not supported for playback in any of the jQuery Media solutions I know. By that I mean not supported out of the box. If there are any hacks or tricks to this Aaron Winborn would be the best resource. Open up an issue at the project page: http://www.drupal.org/project/jquery_media
oh hai! ily! thanks for a
oh hai! ily! thanks for a GREAT informative screencast! can't wait to put it in motion!
I know some had trouble
I know some had trouble making this recipe work. I did as well for a day or so. The primary problem for me was related to permissions for all users for the filefield that I created. Simple but frustrating when new to drupal.
Secondarily, determining the appropriate player to use and its web path location trouble me for a bit. The player ended up in:
(webspace root):~/_drupal-6/mediaplayers/JWplayer/(all the files in JWplayer)
and in JQ media module settings default player as:
mediaplayers/JWplayer/player.swf
You're video really helped me
You're video really helped me get the features I've been looking for. I'd like to thank you for your great and hard work, if it weren't for this, I'd still be clueless as to what to do. Kudos to you, keep up the great work of helping and assisting others:)
I'm having a small issue, everything seems to be fine but I can't get the size of my video to go beyone the "current limit of 2MB" I followed as it stated and everytime I save the configuration, and go to Create Content, then Videos, the size is still 2MB. I'm not sure if I'm doing something wrong, or maybe there isn't an issue at all and I only have the option of uploading a 2MB vid. Can you offer any insight please?
The 2MB limit on your video
The 2MB limit on your video file is not a Drupal problem, it's actually a server problem. It sounds like your web host has set a "file upload limit" on the server side and you may need to contact them to change or raise it. The real bummer is that sometimes shared web hosts are unwilling to change that limit because it will take effect for all 5000 clients on the server. Sounds like a phone call or trouble ticket, I'm afraid.
Thanks for the quick
Thanks for the quick response, I will surely look into that, I guess in the meantime, I'll just have to deal with it. Thanks again:)
I have implemented the
I have implemented the implemented this recipe and it works well. The only issue I am having is getting FLV files to be recognised as media, it just displays them as a code file.
How do I get FLV’s to display?
Thanks.
Adrian
Nice.. it helped me sort some
Nice.. it helped me sort some stuff out that I have been missing..
hai , i tried to use this
hai ,
i tried to use this jquery + filefield thing in drupal with the version of 5.x thing ,i install all the modules and while configureing i get an error like this as follows:
warning: Missing argument 2 for xspf_playlist_flvmediaplayer_file_use() in C:\wamp\www\learn\modules\xspf_playlist\xspf_playlist.module on line 264.
warning: Missing argument 3 for xspf_playlist_flvmediaplayer_file_use() in C:\wamp\www\learn\modules\xspf_playlist\xspf_playlist.module on line 264.
i don't know how to resolve it.
it also shows, sorry , you need to install flash player,
but i already installed flash player.
any solutions please, reply me.
Two thoughts. Make sure the
Two thoughts. Make sure the path to the media player is set properly in the jQuery Media settings. Second, the screencast is for Drupal 6, not Drupal 5, so I can't promise that all the configuration steps in this cast will work for D5. Double check the installation instructions that came with the D5 version.
First I tried this method on
First I tried this method on an already installed drupal 6.9 install.. didn't work.. I just get the link displayed.. so JQ media doesn't load I think...
PS I used JW player.. and did set the path.. but alas.
after trying everything.. I installed a fresh 6.9 with only drush, cck, JQ, jquery_media, filefield and the JW player...
the same thing.. just the link... so I have no clue why this is... it's on a fresh drupal install... filefield
The only thing I set was a width & height in jquery media and I set the path for the JW player.. too bad I dont get any errors for troubleshooting!
HELP?
http://domuzgribidomuz.blogsp
http://domuzgribidomuz.blogspot.com thank you
If you have enabled the
If you have enabled the content permission module in CCK, check the permission access. It seems permissions access needs to be granted for all users for the specific file field in permissions.
Also make sure your player is installed in the correct location at your with in the drupal root directory. (not as subdirectory ie (sites/domain.com/player) as you might be temped with a multi-site install.)
It sounds like you haven't
It sounds like you haven't enabled that content type to display the movies URL as a media player instead. You set this configuration in the jQuery Media setting area, select the content types that you want jQuery Media to work on. From the top of my head, thats the only advice I have.
thanks for a respone Sean..
thanks for a respone Sean.. I rechecked everything again.. and again.. and again...
the advice you give me is good but actually I'm not that n00b to forget such a thing ;) I did enable it.. I even tried to force it to work by adding specific nodes to the field below the check boxes for node-types.. but nothing..
by checking page source I can see it loads the java scripts... I was dumb enough to not think of that before..
if (Drupal.jsEnabled) {
$(document).ready(function() {
$.fn.media.defaults.flvPlayer = '/drupal6/mediaplayer/player.swf';
$.fn.media.defaults.mp3Player = '/drupal6/mediaplayer.swf';
});
}
//-->
The last thing I can think of is that it doesn't go into that if??
Let's try to isolate the
Let's try to isolate the problem further. jQuery Media will work without the mediaplayer application, so lets remove that from the equation. With the media player active, your browser will determine which helper application will launch the video file. Do some tests with the most general format of video there is - quicktime or mpeg or something.
If this doesn't lead us to a solution then I would recommend opening up an issue at http://www.drupal.org/project/jquery_media. There are more people watching that venue than there are here.
Thanks much for the tutorial.
Thanks much for the tutorial. The video was well-made, concise, and high quality. Much appreciated.
Post new comment