Camtasia: How To Put Interactive Videos On Your WordPress Site

In this video I show you how to put an interactive Camtasia video on a WordPress website. Camtasia is an excellent tool for creating screencast videos, but what really makes it interesting is its interactive features. You can use Camtasia to create a video quiz, or an interactive video with clickable hotspot buttons. Really powerful stuff!
The challenge, however, is sharing your interactive Camtasia project with your audience. You can’t just post it on KZbin. KZbin just handles video files. Interactive Camtasia projects contain video files, as well as JavaScript files, HTML, CSS, a lot code that won’t work on KZbin.
So, really the only other option to play your interactive Camtasia video online is to put it on a website. And that’s what I show you in this video: how to put an interactive Camtasia video on a WordPress website.
❤️ If you're finding value in my content, show your support by giving me a Super Thanks!
Techsmith Camtasia Software (affiliate link): bit.ly/camtasiapage
Check out pCloud (affiliate link): bit.ly/pcloudsecurestorage
Check out Screencast.com: www.techsmith.com/screencastc...
Check out Amazon S3: aws.amazon.com/s3/
******************************************************************
Here's some more helpful info:
How to export an interactive project out of Camtasia (at the 11:00 mark in the video): • Camtasia: How To Make ...
How to host a Camtasia interactive project on your website: support.techsmith.com/hc/en-u...
How to host files on Amazon S3: • How to host courses (o...
Aspect ratio calculator: andrew.hedges.name/experiment...
*****************************************************************
Gear used to make this video (Affiliate links):
Camera: Canon EOS M6 amzn.to/2DwXWIc
Camera Microphone: RODE NTG-2 amzn.to/2G8jjBx
Voice-Over Microphone: RODE NT-USB amzn.to/2DBRa7l
Light: F & V Lighting R-300 LED Ring Light amzn.to/2DB3uoG
TWITTER ➔ / michaelkinney
FACEBOOK➔ / michaelkinneymedia
#camtasia #wordpress #elearning

[@tartanrambo]

An excellent video, even after 5 years. Thank you for sharing.

[@AGCorson]

This was better than anything I could find on the Camtasia site. Thanks so much!

[@RicardoJimenezCR]

Thank you so much! What a great teacher you are. Loved the video, your pacing and visuals. Keep up the good work!

[@MikeDfromNC]

I don’t normally comment on youtube videos but felt compelled to after watching this video. Excellent job. Great pace, excellent presentation skills, and very informative.

[@sharonalevitan3425]

This is the second tutorial I am viewing with you Michael. Far ot the best. Thank you so much!

[@gtrayler]

I dont remember ever commenting on a video but I wanted to for your video. They are easy to understand and your voice is clear and easy to understand. Great videos

[@camilaperpignano6177]

You are an amazing teacher. Thank you!!

[@kaimookny]

I've search a lots until I found this video. It's very helpful. I'll try it. Thank you very much.

[@quotivation47]

Outstanding video. SO INFORMATIVE. Thanks for this. :)

[@alperakbash]

Perfect video, thank you very much for the explanations and tips.

[@teacheribrahim9553]

Thank you for the video. Your tutorials help me a lot to be a better teacher in class indeed.

[@mauriciocebada2863]

Congratulation you have an impeccable style to teach, and this video is the best I could find on the web.

Its really hard to find such caring work of education anywhere. You are a tremendous professional. I wish you track a steady path towards great things, an unavoidable destiny when excelency is one's trade mark. Its your case. All the best to You

[@Nelstill]

Nice tutorial, thanks for this!

[@Captiv8r75]

Very well done! Kudos!

[@kasraakbari229]

you are just amazing my friend

[@donovangoh6858]

Hi Michael, great tutorial! Easy to follow and concise. Just wanted to know it is still a problem (still need to download a player) if playing the interactive vid on Iphone when using Camtasia 2020?

[@aashishsingh3893]

Thanks Mike.

[@michaelslater9746]

Michael, thanks for the tips, especially that one about the Camtasia Smart Player app for IPhones. I have had (and still have) a whole load of problems with IPhones when we try to complete PDF form fields and listen to the embedded audio. The phone permits one and not the other. Regards Michael

[@MacVideoMagic]

Had a few people ask about putting a Camtasia quiz, or interactive video onto a website. So, I put together this short tutorial that goes through the process of putting a Camtasia interactive project onto a WordPress site. Hope it helps. 🙂

[@DaveReddy]

So what you are saying is the Camtasia or third party has to develop a plugin to do this much easier than understanding html coding. That would be nice. I assume everyone commenting below understands how to write the html code. Great video, just a sticking point there.

[@areluc]

Oops you did it again, an excellent and informative video, please don't stop! :)

[@MUYJTechs]

ohhh man,,,,what i have just seen! you are great, please make more camtasia videos

[@techhub-10]

Hey thanks for putting this together Mike! You're right though. The iPhone thing is a deal breaker. But I still love my Camtasia. Have you upgraded the software to the latest version? What do you think?

[@helpingpixels5483]

Excellent piece of informative video. Thanks for your effort in putting high quality videos. I just want to know, "How to put interactive videon on webpage that plays automatically, means user do not have to press the play button i.e. auto paly feature if available in camtesia?

[@nickdixon3536]

This was a very good video

[@calamitychang]

Amazing tutorial! Once the video is published and uploaded to a server, can users scrub around the timeline to see the other "choices"? Or would I need to create an end page (for example) allowing users to go back to the beginning? Thank you, i am now going to purchase Camtasia!

[@annmarieelacqua901]

Based on the video, do PCloud and Screencast perform the same function? I use button hotspots, quizzes, and TOC. Also in Camtasia can I add button hotspots and TOC markers in the same project.

[@JamesPereiraChiefLion]

Michael, thanks for this lesson. If I use Screencast or Pcloud to host Camtasia interactive videos and embed on my Wordpress site, will either of them provide analytics?

[@MacVideoMagic]

There is a setting in Camtasia to have results sent to an email address: support.techsmith.com/hc/en-us/articles/360023976751-Quizzes

[@emmasanchezarca]

Hi, Thank you for the tutorial! Really good. I would like to ask you if this videos could be shared on facebook? Thank you again!!

[@MacVideoMagic]

Camtasia videos with interactivity are exported as a mini-website, essentially. So, to put a Camtasia interactive project on Facebook, you would first need to host your exported Camtasia interactive project on a web server, then embed it into your Facebook page using some code, most likely an . Facebook may have some other proprietary way to embed content, not sure.

[@rjsarunitman4805]

hi sir, how about on website builders like godaddy? will this interactive video work?

[@ang.giselle2024]

Great video Michael . If you don’t mind, what camera are you using? The reason I’m asking is because I have an apple from 2010, but uploading my video on KZbin it is very blurry? I also have a logic tech 920 webcam. I Have QuickTime player and have edited my video on iMovie? Once the video is uploaded, the only option I’m given is 140p and 240p. Any assistance is appreciated. 👍

[@MacVideoMagic]

Sounds like you're not recording in HD. First, check to see that the Logitech C920 is recording in 1080p or 720p. Do a test movie recording in QuickTime Player. Then open the recorded file and in the QuickTime Player top menu select Window - Show Movie Inspector and check the size of your video. There's also a "gotcha" with iMovie that could be causing the problem. iMovie sets the size of your edited video based on the FIRST video clip you bring onto the timeline. So, start with a fresh iMovie project and bring in an HD video clip (1080p or 720p) into your project and place it on the timeline. From then on that project with be set to HD. Finally, when you export from iMovie, make sure you're exporting in 1080p or 720p. Hope that helps.

[@bertwesler1181]

Can I use my own videos or must they be screen captures?

[@lalaineorongan2085]

Hi. It's a great help for to have and watched this video of yours but if you could help me with my problem also. I have downloaded a video on WordPress thru Learndash but when the video ended there's like a small photo that will show up saying "MORE FROM BLA BLA BLA " then a follow+ button. Can you help me how to fix this? I wanted to have a black screen once the video ended. Thank you! if you need a screenshot of what I'm saying, just let me know.

[@PeterOde]

Nice video tutorial, but dated now. (#1) Can the Camtasia generated Smart Player now work on an iPhone? (#2) For mobile, the Smart Player buttons should be bigger -- Is that possible? (#3) Amazon S3 is the most cost-efficient host for serving the Smart Player videos, do I copy all files to S# or just the video file? Other tips about using S3?

[@satishgupta5725]

Can you share that video embed code pls

[@overthink5658]

Is there any free alternative for pCloud?

[@DucMinhTeaching]

hiya, thank you for the video, it was very helpful, I wonder I can embed an interactive video on Google Sites?

[@MacVideoMagic]

You can embed Camtasia interactive projects pretty much any site that accepts code, which is a web standard. The challenge for most folks is figuring out where and how to host the files.

[@DucMinhTeaching]

I got it, thank you

[@ProsenjeetDasgupta]

Regarding setting the height and width setting inside the i-frame code, can we not set it to 100% for both width and height instead of what you have added 870 x 443?

[@MacVideoMagic]

Give it a try.

[@Captiv8r75]

One of the ways to easily determine the height for the 16x9 aspect ratio is to act as if you are producing the video again. But when you reach the Smart Player options screen, type that width into one of the fields there and just note what the height changes to.

[@MacVideoMagic]

Thanks for the tip, Rick!

[@MuamerkkiGaming]

Can you add Interactive Videos to google sites?

[@buthainahahmed6317]

Great Tutorial !!

[@MacVideoMagic]

You CANNOT upload a Camtasia interactive quiz to your KZbin channel. KZbin only accepts video files. A Camtasia quiz contains scripts files, html that you can't put on KZbin.

[@lifelessonfromramayana3979]

How to host my interactive video folder on vimeo please guide

[@poojabhardwaj2460]

Can I put Camtasia produced Interactive video on Learndash? Please help.

[@DesiDhamall]

how to add auto play button into these videos?

[@verbling.com.teachers.marie.]

Excellent video. I did not obtain an embed link from pCloud, but a

[@MacVideoMagic]

Hi Marie, you write the embed code yourself, making sure to include the

[@verbling.com.teachers.marie.]

Thank you for response and the time you took to respond.

[@verbling.com.teachers.marie.]

I also the embed code - just like in your video. You do not have "

[@verbling.com.teachers.marie.]

Ok...problem solved. I should use the with the 'HTML' link in the script. Yeah. Thanks again. I wanted your readers to be sure to know that the problem was solved.

[@MacVideoMagic]

Thanks for sticking with it, Marie, and sharing with the community.

[@valeria_cora]

+Michael Kinney Hi! In order to publish these html5 videos to a Facebook page, do I necessarily need to publish them first into a Wordpress blog? I'm sorry about this question, I'm a complete newbie. Thank you!

[@MacVideoMagic]

Hi Valeria, no, you don't need to publish them first to a Wordpress site, but you do need to host them on a Web server in order for them to work. I think Facebook allows you to embed html5 s on pages, not sure.

[@valeria_cora]

Thanks, Michael. I've been trying to follow the instructions on your video to embed html5 on Facebook too, but I couldn't. Where could I search for an answer?

[@iyfnationtv]

How do you host your exported Camtasia interactive project on a web server then embed it into your Facebook page using ?

[@sarahedits7087]

Pls can you help me. I have problems on installing macOs High Sierra I've tried different methods so now whenever I come on it opens up to macOS utilities with a grey background. Every time I try to reinstall a "new copy of macOS" It says "The operation couldn't be completed. Permission denied." Btw I am a subscriber of yours. I commented on this video because it was the earliest video I could find (if not I'm sorry) I know you normally don't do this types of stuff but can you pls help me. You're the best. I like how you're so good at explaining.

[@MacVideoMagic]

Not sure about this one. You may want to post your issue on the Apple Support Forums.

[@sarahedits7087]

thanks

[@MuamerkkiGaming]

for me its just say that cant connect to this content :(

[@markhenry514]

Awesome video!!! any chance to share the whole code in the comments plz.

[@MacVideoMagic]

I'll throw it into the description, Mark.

[@markhenry514]

thank sir

[@MacVideoMagic]

KZbin wouldn't allow me to put the code in the description, so here it is:

[@JA-gw2qr]

Any updates for the player to work on an iPhone since this was made?

[@MacVideoMagic]

Been a while, would have to look into that. Don't know if Techsmith has upgraded their code to be HTML5 compliant, in which case, there should be no need for a player app. Would just run on iOS Safari or Chrome.

[@dickebk]

I'm just watching this video in 2024 and according to Copilot Ai the answer is Yes. Here is the answer it gave me when I asked this question: "In 2024, viewers can watch an interactive Camtasia video embedded on a webpage with the TechSmith Smart Player on iPhones without needing the older TechSmith Smart Player iPhone app. The TechSmith Smart Player has evolved to ensure that interactive elements like hotspots, quizzes, and surveys function correctly across various devices, including iPhones, when the video is embedded using the Smart Player. This is possible because the Smart Player’s JavaScript and CSS are hosted on an Azure CDN, which is compatible with modern web browsers and devices. Therefore, as long as the video is produced with the correct settings and the Smart Player files are included, the interactive features should work seamlessly on iPhones through the web browser."

[@dickebk]

@@MacVideoMagic just in case you were wondering see my reply above. The answer is yes. Thanks for this very helpful video!

[@jacquelinesamuda6547]

Do you have a simpler approach for videos without interactive features?

[@MacVideoMagic]

Depends on the type of video you're trying to make.

[@soyymilk9305]

Coach Armstrong from degrassi I’m shook !!!!!

[@MacVideoMagic]

That's me, coach on TV, coach in real life.

[@GrantSR]

@@MacVideoMagic I should have known you were a professional actor. Each of your videos is a performance, instead of just a "screen recording."

[@MacVideoMagic]

@@GrantSR Actually started my career in public, educational television writing, producing, and hosting science documentaries. Acting became a sideline.

[@markk364]

You'll have to watch the ENTIRE video (which is excellent) to learn at the very end that Camtasia interactive videos can not be viewed on IPhones without the user downloading the player. Yes.. deal breaker to be sure since, you know, billions of potential viewers use IPhones FYI

[@GrantSR]

After a day of watching crappy Camtasia videos put together by supposed Camtasia experts, your videos are a sight for sore eyes, and music to my ears. One can learn how to make better educational videos by osmosis, just by watching how you do your videos. All the techniques you use, the way your videos are scripted and performed. Your videos are a case study in how to do video training right. I'm now going to have to watch your other videos, even on topics I have no interest in, just to pick up on all the subtle techniques you use.