Math247

 

How to Embed Pencasts

Page history last edited by Tim Fahlberg 6 mos ago

Home > Mathcasts-Pencasts > How to Embed Pencasts

  1. 2 ways to Embed Pencasts
    1. Use embed code from LiveScribe
      1. How to modifiy the embed code to enlarge embedded pencasts
        1. Examples
      2. How to modify the "brought to you by LiveScribe" part
    2. Create your own embed code

2 ways to Embed Pencasts

 

Use embed code from LiveScribe

  1. Create Paper Replay session.
  2. Dock with LiveScribe Desktop.
  3. Upload Paper Replay Session to your MyLiveScribe online space.
  4. Edit sharing preferences for the pencast to be public.
  5. Click on 'Embed this file'.
  6. Click and copy the code string provided in the popup dialog.
  7. Paste the code you just copied into your blog or Web page and then publish.
    1. In PBWorks/PBWiki pages use the PBWorks magic HTML/JavaScript Plugin.

    TinyURL to this section:  http://tinyurl.com/cklbvx

 

How to modifiy the embed code to enlarge embedded pencasts

 

       Use a text editor (like Notepad or Wordpad) to change the two occurrences of width="228" height="316"

          To width="342" height="474"  for medium size pencasts 

          To width="456" height="632"  for large size pencasts

 

Examples

  1. Small: 
    Solve and check: 3x-4=32
    brought to you by Livescribe
     
  2. Medium:
    Solve and check: 3x-4=32
    brought to you by Livescribe
  3. Large:
    Solve and check: 3x-4=32
    brought to you by Livescribe

 

How to modify the "brought to you by LiveScribe" part

    Use a text editor (like Notepad or Wordpad) to change the bold strings as shown below

        Old: <a href="http://www.livescribe.com/" target="_blank">Livescribe</a>

        New: <a href="http://www.math247.pbworks.com/" target="_blank">Math247</a>

 

Create your own embed code

  This is useful if you want to embed small, medium, or large versions of pencasts more easily than editing the embed code generated by LiveScribe.

  Method by James Socol and Jim Dornberg[1]

 

How to embed a pencasts

In a web page 

  1. Simple method of embedding pencasts directly in a web page.

    1. Find the pencast you want on LiveScribe.

    2. Click the "Get a link to this file" button.

    3. Select and copy the link to your clipboard.

    4. Go to Pencast Embed: Get code to embed a LiveScribe pencast (opens in a new window)

    5. Follow the instructions on the page to generate the embed code for a small, medium, or large version of the pencast.

    6. Paste the resulting embed code in your web page.

    7. Be sure to thank James and Jim for figuring this out by adding a comment to this page.

  2. Elegant method that Chuck Duncan uses here: http://www.dl.ket.org/physicsap/physicsapPCast/tocPencasts.html

    Notice how he uses some custom JavaScript functions to open pages with pencasts on them.

    Be sure to thank him for figuring this out. 

 

Common steps (new way)

  1. Find the pencast you want on LiveScribe.

  2. Click the "Get a link to this file" button.

  3. Select and copy the link to your clipboard.

  4. Go to Pencast Embed: Get code to embed a LiveScribe pencast (opens in a new window)

  5. Follow the instructions on the page to generate the embed code for a small, medium, or large version of the pencast.

     

Common steps (old way)

  1. Copy the set of code below for normal or large size and paste it into your favorite text editor (WordPad or TextPad).
  2. Visit My LiveScribe - Find the pencast you want to embed.
  3. Right-click to view source code, search for "flashXML?xml="

    Note: Right-clicking to view source code in IE7 doesn't always work but it always works when using Mozilla FireFox. 

    Another reason to ask LiveScribe to share embed code eh?!

  4. Copy the long string after this.  Something like this: "0000C0A80115000009C5B6020000011A24F1741D0399FEB7"
  5. Replace this string in your text editor in both places.

     

Code

  1. For normal size

    <object height="316" width="228" align="middle" id="myFlashContent3" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">

    <param value="http://www.livescribe.com/media/swf/pencastPlayer.swf?path=http://www.livescribe.com/cgi-bin/WebObjects/LDApp.woa/wa/flashXML?xml=0000C0A80116000009C6880A0000011F8FBA4C689840072A" name="movie" />

    <param value="high" name="quality" />

    <param value="true" name="allowfullscreen" /> <object height="632" width="456" align="middle" data="http://www.livescribe.com/media/swf/pencastPlayer.swf?path=http://www.livescribe.com/cgi-bin/WebObjects/LDApp.woa/wa/flashXML?xml=0000C0A80116000009C6880A0000011F8FBA4C689840072A" type="application/x-shockwave-flash">

    <param value="high" name="quality" />

    <param value="true" name="allowfullscreen" /> <a href="http://www.adobe.com/go/getflashplayer"><img alt="Get Adobe Flash player" src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" /></a></object></object>

     

  2. For medium size

    <object height="474" width="342" align="middle" id="myFlashContent3" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">

    <param value="http://www.livescribe.com/media/swf/pencastPlayer.swf?path=http://www.livescribe.com/cgi-bin/WebObjects/LDApp.woa/wa/flashXML?xml=0000C0A80116000009C500170000011F8FB898509840072A" name="movie" />

    <param value="high" name="quality" />

    <param value="true" name="allowfullscreen" /> <object height="316" width="228" align="middle" data="http://www.livescribe.com/media/swf/pencastPlayer.swf?path=http://www.livescribe.com/cgi-bin/WebObjects/LDApp.woa/wa/flashXML?xml=0000C0A80116000009C500170000011F8FB898509840072A" type="application/x-shockwave-flash">

    <param value="high" name="quality" />

    <param value="true" name="allowfullscreen" />

    <a href="http://www.adobe.com/go/getflashplayer">

    <img alt="Get Adobe Flash player" src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" /></a></object></object>

     

  3. For larger size

    <object height="632" width="456" align="middle" id="myFlashContent3" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">

    <param value="http://www.livescribe.com/media/swf/pencastPlayer.swf?path=http://www.livescribe.com/cgi-bin/WebObjects/LDApp.woa/wa/flashXML?xml=0000C0A80116000009C500170000011F8FB898509840072A" name="movie" />

    <param value="high" name="quality" />

    <param value="true" name="allowfullscreen" /> <object height="632" width="456" align="middle" data="http://www.livescribe.com/media/swf/pencastPlayer.swf?path=http://www.livescribe.com/cgi-bin/WebObjects/LDApp.woa/wa/flashXML?xml=0000C0A80116000009C500170000011F8FB898509840072A" type="application/x-shockwave-flash">

    <param value="high" name="quality" />

    <param value="true" name="allowfullscreen" />

    <a href="http://www.adobe.com/go/getflashplayer">

    <img alt="Get Adobe Flash player" src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" /></a></object></object>

     

 

 

 

 

 

 

Footnotes

  1. Jim Dornberg, Instructional Technology Specialist, Monroe County ISD, Monroe, MI) asked James Socol (Social Web Applications Developer) to create a web tool that would create the embed code. The growing pencast community is grateful for your work James and Jim! ▲

Comments (0)

You don't have permission to comment on this page.

Printable version
 
Anonymous Create an account or Log in