So you created your Camtasia interactive video with quizzes and clickable
hotspots and now you want to share that with your audience well in this video
I'm gonna show you how to share your Camtasia interactive project on a
WordPress site coming up
hey it's Mike with more tips and tools to help you create and share engaging
informative and educational video and if it's your first time here thanks for
taking the time and make sure you hit that big subscribe button and don't forget to click the
little bell icon so you don't miss a thing
Camtasia is an excellent tool for creating screencast videos but what
makes it really interesting to me are its interactive features you can use
Camtasia to create interactive video quizzes or interactive videos with
clickable hotspot buttons powerful stuff the challenge however is sharing your
Camtasia interactive project with your audience so you can't just post it onto
YouTube. YouTube just handles video files Camtasia interactive videos contain
video files HTML files JavaScript files all kinds of code that will not work on
YouTube so really the only other option for getting your interactive Camtasia
project to play online is to put it on a website and that's what we're gonna do
in this video we're gonna take a Camtasia interactive video and put it
onto a WordPress website so let's get started I'm going to assume you already
know how to properly publish an interactive Camtasia project if you
don't know how to do that I have a video on creating hot spots in Camtasia that
goes through the publishing process a link to that video is on your screen
I'll also leave a link to that in the description below so once you publish
your Camtasia interactive project you'll get a folder containing all the files
needed to make your project work now if we take a quick look in this folder by double-
clicking it you can see those project files so the first step in the process
is to put this folder and its contents on a web server so our WordPress site
can link to it now you have a few choices here
if yourself hosting your WordPress site you can upload your project folder and
its contents to your web hosting account and serve the files from there it's
really just a matter of uploading the folder to a spot on your web server and
linking to it now you can run into trouble with this method if your
Camtasia project is large with lots of videos and/or you're expecting a lot of
people to be accessing your interactive video simultaneously you could put a
serious load on your server you could blow through your bandwidth cap you
could slow down your server and consequently your website and other
people's websites if you're on a shared hosting plan so it's probably a good
idea to just check with your web hosting company before you decide to host your
Camtasia interactive project on your web hosting account an alternative to
uploading your project folder to your own web server is to upload it to a
large-scale third-party web hosting service TechSmith the maker of Camtasia
has its own web hosting service for Camtasia projects screencast.com
then there's Amazon simple storage service or S3 a popular choice it's
reliable and relatively cheap but Amazon S3 can be a bit challenging to use
another third-party hosting service is pCloud it's a cloud storage platform very
much like Dropbox but unlike Dropbox when you buy pCloud's premium account
you get your own public folder which allows you to serve web content so in
addition to having cloud storage like Dropbox you have your very own web
server and you can use that web server that public folder to serve your
interactive Camtasia project files over the web
let me quickly show you how that works so here I am in my pCloud account file
manager and you can see I have this public folder right here this is where I
upload content I want to serve on the web if I click that folder it opens and
you see I don't have any files in there yet
so I'm going to upload my Camtasia interactive project folder to this
public folder so that I can put it online and link to it from my WordPress
site so I'll hit this upload button and I'll get this upload manager and I can
choose to upload files or folders since I'm uploading a folder I'll select
folder upload I'll select pick folder and navigate to my Camtasia published
project folder select it and hit OK and my Camtasia project folder and all its
contents are uploaded to my public folder on pCloud
when everything is uploaded I'll close the upload window and there you can see
my Camtasia project sitting here inside my public folder ready to be shared over
the web alright so we've done step one we put our Camtasia project on a web
server now we're ready to actually put our Camtasia interactive video on our
WordPress website so let's jump over to WordPress so here I am in the backend
the dashboard of this demo WordPress site I created for this tutorial and I'm
going to create a new page to display my Camtasia interactive video so I'll just
go over here and under pages I'll select add new
I'll give my new page a name
so to embed my Camtasia interactive video into this WordPress
page I'm gonna need some HTML code and I have it right here I'll just switch over
to the text mode in the WordPress editor here and paste in that code alright
let's have a look this code will create what's called an iframe in this web page
think of it as creating a window in this web page that can display other web
pages from across the web now to work properly this code needs an important
piece of information and that's this code right here this is the link to my
Camtasia interactive video specifically to the Camtasia Smart Player for my
project the Smart Player is what actually plays your interactive video
you need to use the Smart Player if you have any interactive video features in
your Camtasia project so this Smart Player is what you need to embed in your
web page now don't worry the Camtasia Smart Player is automatically generated
and included in your project folder when you publish your interactive video
so where exactly did I get the link to the Smart Player well let me show you
I'll just hop back over to pCloud I got this link by going into my public
folder on pCloud into my Camtasia project folder to the Camtasia Smart
Player which is the index underscore player HTML file right here then I moved
over to this little share menu and selected get link and this window opens
up where I can copy the link to this index underscore player HTML file on my
pCloud public folder then I just pasted that into the source attribute that SRC
equals part of my iframe code and that's what you would do if you were using any
other web hosting method be it your own web server or Amazon S3 or wherever
after you've uploaded your Camtasia project folder you would grab the link
to that underscore player dot HTML file and paste it into your iframe code
you'll also want to enter dimensions in your iframe code that's the width and
height settings here so your interactive video sits in your web page properly now
these settings are based on the dimensions of your Camtasia video and
the width of the content area in your WordPress page so in my case I went over
to my WordPress page in my browser and I'm using Chrome
I right clicked and I selected inspect to see the underlying code of this page
I found the width of the content container for the page which is 840
pixels so that's what I set for the width attribute in my iframe code
because I want my video to be as wide as the content area of my WordPress page
for the height setting the size of my Camtasia project is 1920 pixels wide by
1080 pixels tall which is a 16 by 9 aspect ratio so if I want the width of
my project to be 840 pixels to fit into the content area on my WordPress page
while maintaining that 16 by 9 aspect ratio the height setting should be 473
pixels now if math isn't your thing you can use an aspect ratio calculator to
determine the numbers you need for your particular situation there are a bunch
online I'll leave a link to one in the description below okay now that our code
is ready let's see what we've got I'll just publish my wordpress page
then I'll view my page
and there's my interactive Camtasia video embedded nicely into my WordPress
website I'll hit the play button and there it goes
you can even make the video fullscreen by hitting this button on the player
that's nice I'll just hit escape to bring that back
down to size
so that's how you can add your Camtasia interactive video to your WordPress site
now the method I showed you will work on just about any webpage iframe code is a
web standard but I should just mention mobile Camtasia interactive videos using
the TechSmith Smart Player will play in pretty much any browser or on any device
except as of the date of this recording the iPhone if you want to access
Camtasia interactive content with an iPhone you will be directed to download
and install the free TechSmith Smart Player app after you download and
install that you'll be able to access the Camtasia interactive content now
that extra step may be a deal-breaker for some people but I figured I mention
it well that's it for this video I hope you found value in it and if you want to
continue to discover more tips and tools for creating and sharing engaging
informative and educational video make sure you hit that big subscribe button so you don't miss
a thing thanks for watching and I'll see you next time
Không có nhận xét nào:
Đăng nhận xét