Is There A Free 'Easy' Way To Embed A Camtaisa Video

7 replies
Hi Guys, I'm looking for a free & easy way to embed a camtasia video in a HTML webpage.

I know Camtasia can create a HTML page with the video on it. But I want to be able to embed the video like you can embed say a Youtube video with other content.

I've tried using Iframes but the video always looks weird and out of place. I'm obviously doing something wrong with the code.

Any suggestions...
#camtaisa #easy #embed #free #video
  • Profile picture of the author Bill Farnham
    When you create a video in Camtasia you'll see the software produces a bunch of files associated with that video.

    One of the files is a HTML file (you mentioned this) and on that file page you need to look for the coding nearer the bottom of the page that looks like this...

    <!-- Users looking for simple object / embed tags can copy and paste the needed tags below.
    <div id="media">
    <object id="csSWF" classid="clsid:d27cdb6e-dd6d-11cf-96b8-444553540000" width="1280" height="738" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version==8">
    <paramname="src"value="your_video_name_here_contro ller.swf#"/>
    <param name="bgcolor" value="FFFFFF"/>
    <param name="quality" value="best"/>
    <param name="allowScriptAccess" value="always"/>
    <param name="flashVars" value="csConfigFile=video-name_config.xml&csColor=FFFFFF"/>
    <embedname="csSWF"src="your_video_name_here_contro ller.swf" width="1280" height="738" bgcolor="FFFFFF" quality="best" allowScriptAccess="always" flashVars="csConfigFile=cannon-fire100_config.xml&csColor=FFFFFF" pluginspage="Adobe - Install a different version of Adobe Flash Player>
    </object>
    </div>


    What you want to do is copy this code starting at the <div id="media"> all the way through to the </div> tag. Paste it into your webpage where you want the video to be shown.

    You'll notice I colored the instructional line in RED and the opening and closing <div> tags in blue to make this easier to understand.

    ~Bill
    Signature
    {{ DiscussionBoard.errors[4954284].message }}
    • Profile picture of the author Damielle
      Originally Posted by Bill Farnham View Post

      When you create a video in Camtasia you'll see the software produces a bunch of files associated with that video.

      One of the files is a HTML file (you mentioned this) and on that file page you need to look for the coding nearer the bottom of the page that looks like this...

      <!-- Users looking for simple object / embed tags can copy and paste the needed tags below.
      <div id="media">
      <object id="csSWF" classid="clsid:d27cdb6e-dd6d-11cf-96b8-444553540000" width="1280" height="738" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version==8">
      <paramname="src"value="your_video_name_here_contro ller.swf#"/>
      <param name="bgcolor" value="FFFFFF"/>
      <param name="quality" value="best"/>
      <param name="allowScriptAccess" value="always"/>
      <param name="flashVars" value="csConfigFile=cannon-fire100_config.xml&csColor=FFFFFF"/>
      <embedname="csSWF"src="your_video_name_here_contro ller.swf" width="1280" height="738" bgcolor="FFFFFF" quality="best" allowScriptAccess="always" flashVars="csConfigFile=cannon-fire100_config.xml&csColor=FFFFFF" pluginspage="Adobe - Install a different version of Adobe Flash Player>
      </object>
      </div>


      What you want to do is copy this code starting at the <div id="media"> all the way through to the </div> tag. Paste it into your webpage where you want the video to be shown.

      You'll notice I colored the instructional line in RED and the opening and closing <div> tags in blue to make this easier to understand.

      ~Bill
      Thanks, will give this a try. Hopefully it works
      {{ DiscussionBoard.errors[4954387].message }}
    • Profile picture of the author Damielle
      Originally Posted by Bill Farnham View Post

      When you create a video in Camtasia you'll see the software produces a bunch of files associated with that video.

      One of the files is a HTML file (you mentioned this) and on that file page you need to look for the coding nearer the bottom of the page that looks like this...

      <!-- Users looking for simple object / embed tags can copy and paste the needed tags below.
      <div id="media">
      <object id="csSWF" classid="clsid:d27cdb6e-dd6d-11cf-96b8-444553540000" width="1280" height="738" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version==8">
      <paramname="src"value="your_video_name_here_contro ller.swf#"/>
      <param name="bgcolor" value="FFFFFF"/>
      <param name="quality" value="best"/>
      <param name="allowScriptAccess" value="always"/>
      <param name="flashVars" value="csConfigFile=video-name_config.xml&csColor=FFFFFF"/>
      <embedname="csSWF"src="your_video_name_here_contro ller.swf" width="1280" height="738" bgcolor="FFFFFF" quality="best" allowScriptAccess="always" flashVars="csConfigFile=cannon-fire100_config.xml&csColor=FFFFFF" pluginspage="Adobe - Install a different version of Adobe Flash Player>
      </object>
      </div>


      What you want to do is copy this code starting at the <div id="media"> all the way through to the </div> tag. Paste it into your webpage where you want the video to be shown.

      You'll notice I colored the instructional line in RED and the opening and closing <div> tags in blue to make this easier to understand.

      ~Bill
      I tried this and it didn't work, does it matter what type of video it is, for example MP4 or FLV.

      In the editor I can see the change/space for the video has changed, however, when I browse there's nothing there
      {{ DiscussionBoard.errors[4954445].message }}
      • Profile picture of the author Bill Farnham
        Originally Posted by Damielle View Post

        I tried this and it didn't work, does it matter what type of video it is, for example MP4 or FLV.

        In the editor I can see the change/space for the video has changed, however, when I browse there's nothing there
        Make sure at this stage that the video files (MP4 ?) are uploaded onto the same hosting directory as the webpage you are putting the video code on. All the code does is call up the video and use a Camtasia compatible Macromedia player so the video plays on your website.

        BTW, for a small file size so the video displays correctly on the web be sure to render it in Camtasia at a lower setting than 100%. Try starting out at about 35% and move up in 5% increments until you're happy with the quality.

        Large MP4 files won't play very well on the web if the video duration is short.

        ~Bill
        Signature
        {{ DiscussionBoard.errors[4954472].message }}
        • Profile picture of the author Damielle
          Originally Posted by Bill Farnham View Post

          Make sure at this stage that the video files (MP4 ?) are uploaded onto the same hosting directory as the webpage you are putting the video code on. All the code does is call up the video and use a Camtasia compatible Macromedia player so the video plays on your website.

          BTW, for a small file size so the video displays correctly on the web be sure to render it in Camtasia at a lower setting than 100%. Try starting out at about 35% and move up in 5% increments until you're happy with the quality.

          Large MP4 files won't play very well on the web if the video duration is short.

          ~Bill
          Hi Bill tried it again and it works, when I use the browse function from my web editor it doesn't show the video, however when I uploaded it, and went to the address online it works perfectly.

          Thanks again
          {{ DiscussionBoard.errors[4954547].message }}
  • Profile picture of the author Evan-M
    either use the files it exported with the video to embed it or use jwplayer.
    Signature

    Evan-M

    Easily The Worlds Best Wordpress Popup plugin

    Visit Website Design Firm For All Your Wordpress Coding Needs

    {{ DiscussionBoard.errors[4954291].message }}

Trending Topics