Embedding Jing Pro Videos In WordPress
Posted by Brooks in Jing on Feb 9th, 2009 | 16 commentsI get quite a few questions about how to embed Jing Pro content in a WordPress blog. Rather than typing out a long tutorial I’ve made a couple of screencasts that show you how to get up and running.
The first screencast shows you how to use Screencast.com (free hosting that comes with Jing), Jing Pro and WordPress 2.7. We’ll cover the following:
- Creating an “embed” button that returns embed code after your video has been uploaded to Screencast.com.
- Creating a new blog post in WordPress 2.7.
- Fixing the embed code returned by Screencast.com.
- Changing the embed dimensions so that your video will fit nicely within your blog’s content column.
Go fullscreen 
to see the video in full 1:1 pixel clarity.
The second video walks through the process I personally use to embed content in my WordPress blog using the Kimili Flash Embed plugin. It will cover the following:
- Saving locally.
- Uploading video and thumbnail to web server manually with an FTP client.
- Making sure the Jing Pro video player is in the same directory on your web server as the video content you’re hosting.
- Using a previous post’s Kimili embed syntax.
It should be noted that I forgot to change the flashvars variable named “thumb” to use the correct url–you’ll want to make sure you do that.
Go fullscreen to see the video in full 1:1 pixel clarity.
16 Responses to “ “Embedding Jing Pro Videos In WordPress”
Leave a Reply
Thanks Brooks. That was exactly the information I needed. I didn’t realize the Kimili flash embed could be used to embed .MPEG4 videos as well.
Can I get your advice on something else? I’m deliberating on the best way to embed screencasts into my blog. My alternative to the Jing embed or the Kimili flash embed is to use Vimeo’s HD option. I record the screencast in 1280×720 resolution, upload to Vimeo, and it converts it automatically to HD quality. For an example, view this screencast: http://vimeo.com/3140858
The benefits of Vimeo over the Jing wrapper is that it looks clear even when small. Vimeo makes sharing easy, and after viewing one video, it shows my other videos as well. The drawbacks are that Vimeo plus costs $60 a year.
Can you compare the Jing embed solution with the Vimeo HD solution? Thanks. And hey, awesome to see the notify me of followup comments option.
Tom
[...] Embedding Jing Pro Videos In WordPress Tom Johnson | February 9, 2009 | permalink Tags: embedding, jing, wordpress [...]
[...] Andrus, one of the Jing developers, created a tutorial on how to embed Jing videos into WordPress blogs. You have to change a few parameters in the default screencast.com embed code to make it play in [...]
Brooks, are there any plans to create an HD compressed look similar to Vimeo in the compressed display of the video? I love that expanding Jing yields perfect pixel clarity, but it’d be great to go one step further and offer HD in the compressed mode.
@Tom – I’m a little unclear on what HD in compressed mode means. Are you saying you’d like the video to look crisper and sharper when scaled down? Could you give me a bit more color?
I can tell you that the Jing guys are looking at optimizing / tweaking the encoding settings. One of the challenges with Jing content is that its trying to do real-time or near real time encoding. I think there’s lots of room for improvement, but I’m not sure how fast or how far the changes will be (I’d love to see the ability to configure / tweak a variety of encoding settings in the preferences, but its doubtful that will happen given the scope and biz model of Jing). I’ll pass on your sentiments though. ;-)
Yes, I’d like the Jing videos to look sharp even when scaled down. This is something that Vimeo is doing with their videos. If you go to http://vimeo.com/3140858, you’ll see that the video looks fairly crisp (though not entirely) even though it’s scaled down. Same with some of the videos on WordPress.tv. If you guys could do the same with Jing, it would be incredible. Right now I think it’s very appealing as is.
By the way, is there any way to alter Jing’s code so that I don’t have to manually change the height and width dimensions after uploading to screencast.com? Shouldn’t that be a setting somewhere? Even if I had to go into the application’s code, I’d be interested in learning how to do that.
Excellent display and content of the process. Works like a charm!
Thanks
I just updated the Jing h.264 wrapper (overlayplayer.swf) in the download links:
http://www.brooksandrus.com/resources/jingpro_ftp_template.zip
This version significantly improves quality when the video is scaled down. Update your ftp templates!
Hi there. Checked the vids on this page 100 times and am doing just as it says but my screencast vids are not being shown on my wordpresspage. What am I doing wrong here?
Sorry if this is not the right place to put this, but maybe there is a merciful soul out there to point me in the right direction. And YES, am new to all this stuff.
Greetz
Christian
@Christian – How about making a jing video that walks me through the problems you’re having–should be a bit easier to troubleshoot.
This was great. Thank you. It took me a little while to figure out that the Kimili embed code you used was a little different from what Kimili generates itself, but once I got that straight, I was golden. Thanks again!
[...] the brain fart mentioned above. Learning what the problem was involved learning a fair amount about changing embed code and ftping, how to embed Jing on an EduBlog and a cool Jing video resizing tool (too late for me since I [...]
Is there anyway to use the code you posted above with a express show wrapper? For some reason my kimili code generator isn’t working so I copied the code from you. I have two different versions.
First
The problem I have with this code is it loads when the page loads. It really hogs bandwidth. Other than that it’s great
then I have
I can’t seem to get the overlay player to show up at all.. Thanks for all your great content here.. I’ve been stumped for months trying to solve this.
Hey David, If you’re still having issues ping me at b.andrus@techsmith.com and we can take a closer look at what you’re trying to do.
[...] Embedding Jing Pro Videos In WordPress This is the blog of Brooks Andrus. Here, at irregular intervals, you may find digital noise centered around the activities of an early 21st century technologist. I work for TechSmith Corporation, but this web space and the views found on it are entirely my own. Share and Enjoy: [...]
Great info. thanks for the insight i can’t wait to embed my jing videos on my word press blog. Just when I was wondering if it would be possible you come along to make it much easy and hastle free to embed jing on my site.
Blessings,
J.W.
http://johnwrhodes.com