OPTION TWO: INTEGRATE OTHER ONLINE TOOLS
ʍ This technique incorporates slideshows you can create using other online
tools or services. Even beginning teachers can create slideshows using
these tools and incorporate them into their eChalk pages.
There are many online services that allow you to easily create custom photo slideshows. You
upload your photos, and add transitions or music. The service will then provide you with the
necessary HTML code to add your slideshow to a Web page.
Here is a list of some current online photo and slideshow Websites. Some are free and some
require registration and/or a fee. Explore one or more of these sites, or search online for others, to
ONLINE IMAGE AND SLIDESHOW RESOURCES
Î Class Page Example (see #2)
To integrate your created slideshow into your
Class or Group Page:
1. In the Resources area of your class, click the Add
button and choose the “Create a Web page” option.
2. Enter a title for your page such as “Our
3. Open the Text/HTML drop-down menu and select
the “No Formatting: Will display text & HTML as is”
4. Copy the HTML code snippet provided by the online
service you used and paste it into eChalk’s publishing
text box. It may look something like the example to
the right. (Look for the word “EMBED”)
5. Click Save.
FOR SITE MANAGERS:
In the Manage Site>Resources area:
1. Click on an existing navigation folder (e.g. School Resources)
and then click on the Add Resource button.
2. Select either the “Create an Information Page” or
“Create a News Page” option and click Next.
3. Follow Steps 2-5 in the instructions for teachers listed above.
Î Homepage Resource Example (see “Integrated Online Tool”)
!! IMPORTANT !!
**You should fully investigate your own district’s policies for publishing content from external sources. Many online services incorporate links
back to their Websites. Only you can determine whether you are comfortable with the possibility of visitors to your page (students or parents)
being led to these external sites. eChalk is not affiliated with any of the listed third-party services. eChalk does not endorse, support, nor accept
liability for any external third-party services or tools.
** INTERMEDIATE **
Choose the “No Formatting” option when entering your
own custom HTML code.
C# Word - Convert Word to HTML in C#.NET
VB.NET How-to, VB.NET PDF, VB.NET Word, VB toolkit SDK, preserves all the original anchors, links, bookmarks and font C#: Convert Word document to HTML5 files. bookmarks in pdf; bookmarks in pdf reader
OPTION THREE: EMBED YOUR OWN MEDIA
ʍ Use this technique when you want to embed and display custom media
that you have created and produced for the Web. (Requires some HTML knowledge.)
If you prefer not to use another online service to produce your video or slideshow, you can easily
create your own using software on your computer.
Publishing multimedia content on a Website is a three-step process:
1. First, create and produce your media file. [Page 5]
2. Second, store your media file on a Web server (or host). [Page 7]
3. Third, add the necessary HTML code to embed the media in your Web page. [Page 8]
Creating and embedding custom multimedia content can be a lot of fun and really enrich your
school’s Website. The process is not difficult but it does require some HTML knowledge which
may be overwhelming for beginning Internet users. Also, eChalk Site Managers will need to assist
teachers with steps two and three.
Î VIEW EXAMPLES: Homepage Resources (see “Custom Embedded”)
Class Page Example
STEP 1: CREATING AND PRODUCING MEDIA FOR THE WEB
Multimedia content on the Internet exists in many different formats. The most common media
formats on the Internet are: Flash (.swf), QuickTime (.mov), and Windows Media (.wmv). Here
are a few examples of FREE or low-cost software you can use to create your own videos and
CREATING MEDIA — CHOOSE YOUR FORMAT
Windows Movie Maker (FREE and included with Windows XP)
Microsoft PhotoStory (FREE download from Microsoft,
iPhoto & iMovie (part of the iLife series of software from Apple)
It is not necessary to purchase the full Adobe Flash software to produce simple
Flash slideshows or media. There are a number of inexpensive applications
available and many provide free trial versions. Search on Google for “create
flash slideshows” to find others. Two examples are:
Wondershare Flash Slideshow Builder
AnvSoft Flash Slide Show Maker
DISCLAIMER: The above examples are provided for illustration purposes only. eChalk is not affiliated with any of the companies or third-party
software services listed above. eChalk does not endorse, support, nor accept liability for any external third-party services or tools.
** ADVANCED **
STEP 1: CREATING AND PRODUCING MEDIA FOR THE WEB (continued)
PRODUCING MEDIA — ABOVE ALL, KEEP IT SMALL!
When you produce media for the Web always strive to get the smallest file size possible. Most Web
users will not wait 5 minutes to download a 10 MB video file. Large videos embedded on a page
can also delay the display of other content. The main factors that affect file size are: the length of
the video, the dimensions of the video, and the settings for audio quality and compression. Here
are a few tips for producing video and media files for the Web.
Video clips on the Internet should be shorter rather than longer. It is better to
provide multiple smaller clips rather than one long clip. General guidelines:
3-6 minutes maximum.
Video dimensions are listed as width by height (w x h or 640 x 480). Smaller
dimensions result in much smaller file sizes. Dimension will also depend on
publishing context (e.g., within a page that has other content vs. on a page of
On a separate page: width <= 640, height <= 480 (640 x 480 [max])
In context: width <= 400, height <=300 (320 x 240 is a standard size ratio)
Smaller file size results in quicker downloads and viewing by Web visitors.
File size is affected by many factors working in combination.
Audio quality--- higher audio quality = larger file size (try mono instead of
stereo for smaller files)
Compression --- higher video compression = smaller file size (but quality may
suffer with extreme compression).
Dimensions --- smaller dimensions = smaller file size (see above)
When exporting/publishing your finished video, look for various export
settings and experiment to find ones that are satisfactory for you.
After you create your media file, make note of its final dimensions (width and height). This will
look something like: 160 x 120, 320 x 240, 640 x 480, 800 x 600, etc. Viewing this information will
vary depending upon which operating system you use (MAC or PC), the tool you use, or the
format of the media file you produce. Sometimes you can check the “Properties” of the file to view
this information (PC: right-click on the file, MAC: select the file and press
MY MEDIA FILE’S WIDTH: __________ x HEIGHT: ___________
STEP 2: STORING (OR HOSTING) YOUR MEDIA ON A WEB SERVER
After you have produced your media file, you are ready to upload and store it on a Web server. eChalk
provides each site with its own public Web server in the Manage Site>Hosting area. Site Managers can
use the eChalk Hosting area to store their custom video and Flash files.
TIP! Make sure the file name of your video uses all lowercase letters and has no spaces! (e.g. myvideo.wmv)
To upload a file to your school’s Hosting area:
1. Log in to your eChalk account.
2. Click the Manage Site button.
3. Click the Resources button.
4. Click the Hosting link located in the top gray toolbar. A
list of files in your school’s Hosting area will display.
Note: It is recommended that you create folders for different
projects or types of files. For example: media, sciencefair,
etc. Click the Create button to add a new folder. Click the
folder name to open your new folder and proceed to step 5.)
5. Click the black Add button. The Add File screen will
6. Click the Browse button to locate the media file on your computer. Select the media file and click Open. The
name of the media file will display in the Browse field.
7. Click the black Upload button. A link to the media file you just uploaded will display in your Hosting area.
Now you need to capture the URL address of your file so you can embed it into your Web page.
To find the URL address for your hosted media file:
1. First, you will need the full HTTP:// path. This is listed
directly below the Hosting link at the top. It will begin with:
2. Then, add a forward slash “/” and the file name onto the end
to complete the file path.
For example: /natureQTmovie.mov
3. To retrieve the URL all at once so you can copy/paste:
a. Select the checkbox to the left of your file name.
b. Click the Add Link button.
c. On the next page, use your mouse to
highlight and copy the full Web Site
d. Click Cancel at the bottom of the page.
e. Paste the Web Site Address into a new
Word document or Notepad text file to
save it for use in the next step.
Now you are ready to embed your media into a Web page!
STEP 3: ADD THE HTML CODE TO EMBED THE MEDIA INTO YOUR PAGE
Embedding media into a Web page may be done using the HTML <EMBED> tag. You need the
URL address for your hosted media file in order to write the necessary EMBED code. The EMBED
code you use will vary depending upon the format of your media file (WMV, MOV, or SWF) and
any specific attributes or options you wish to include (auto-play, loop, display player controls).
To create your HTML code, you may either:
1. Write Your Own (see page 10 ), or
2. Use an Online Generator Tool (see page 11)
To add the HTML code to your page:
Enter your HTML code into any of eChalk’s Text/HTML publishing areas set to NO
FORMATTING. (Do not use the Rich Text Editor or Standard Formatting settings. Choose
“NO FORMATTING: Will display text & HTML as is”)
Choose the “No Formatting” option when entering your
own custom HTML code.
This example illustrates using the “Create a Web page” option in
the Resources area of a Class or Group Page.
EXAMPLE: ADD A VIDEO TO YOUR ANNOUNCEMENTS AREA!
Site Managers can use the following simplified code example to add a Windows Media (.WMV)
video (320 x 240) to their school’s homepage in the ANNOUNCEMENTS area (Manage
Site>Homepage). Insert the URL address of your media file in the place indicated.
<EMBED SRC="INSERT URL ADDRESS OF YOUR VIDEO FILE" AUTOSTART="1" LOOP="1"
SHOWCONTROLS="1" TYPE="application/x-mplayer2" WIDTH="320" HEIGHT="285"
ALIGN="middle" HSPACE="20" VSPACE="10" />
**NOTE: notice how the HEIGHT attribute is 285 in the code snippet, yet the video clip’s height dimension is 240.
You must add an additional 45 pixels to the height to allow for the Windows Media player controls.
Places to Embed Media in eChalk
Î Homepage Announcements (see screenshot below)
Î Class & Group Pages Descriptions
Î Class & Group Pages Announcements
Î Homepage Resources
(choose “Create an Information
or “Create a News Pages”
Î Class & Group Resources
(choose “Create a Web page”
Î Calendar Events
(set to “Show as a separate page”
Î Homepage Resource Folder
(add to “Folder Description”
Feature videos and photo slideshows of recent school
activities, class projects, assembly programs, and more
directly on your homepage!
Documents you may be interested
Documents you may be interested