Networked Learning

http://www.thenetworkedlearner.com

Google Earth Tutorials

Part V – Embedding Objects

Hosts – Thomas Cooper, Alice Barr

Networked Learning 2010
Embedding Images

With this in mind, images are typically

uploaded to a photosharingsite. The URL
address of the images is referenced from
the image and then displayed in the
Google Earth balloon.

Networked Learning 2010

Favorite Photosharing Sites
• Photosharing Sites
– Photobucket
– Web Picassa
(Google)
– Flickr
– Facebook

* Images need to be stored online in order for Google Earth to

re fe re n ce th e m th ro u g h th e X H T M L co d e .

Networked Learning 2010

Working with Images
Directions
1.Open a browser and
navigate to the photo
sharing website.
2.Sign in to your account.
3.Right-click on the
photo and look for the
“Address (URL)” code.
4.Copy the code.
5.Click on the “yellow
pushpin” to create a
GE placemark.
6.Paste the code into the
“Description” window.
7.Click “OK”.
8.

Networked Learning 2010

 What the HTML Code is
About
• Main Image Tag
<img src=“imagename.jpg” height=“#” width=“#”


align=“position”)

tag attributes values

HTML code is comprised of opening tags, closing tags, attributes & values.
The only difference between an opening tag and a closing tag is the backward slas
Some HTML code tags, such as images don’t have closing tags. There are really few

Networked Learning 2010

Embedding Videos

With this in mind, videos are typically

uploaded to a video sharing site. The URL
address of the video is referenced using the
embed tag, along with the source tag, and
then displayed in the Google Earth balloon.

Networked Learning 2010

Favorite Video Sharing Sites
– Vimeo
– YouTube
– Google Video
– TeacherTube

Networked Learning 2010

Embedding Video Directions
1.Open a browser and
navigate to the video
sharing website.
2.Sign in to your account.
3.Click on the video and
look for the “Embed in
Website” button. If
you don’t see “Embed”,
it may be under
“Share”.
4.Copy the code.
5.Click on the “yellow
pushpin” to create a
GE placemark.
6.Paste the code into the
“Description” window.
7.Click “OK”.
8.

Networked Learning 2010

 Typical Code for a Video
Embed
<object width="400" height="320"><param


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

name="allowscriptaccess" value="always" /><param
name="movie"
value="http://vimeo.com/moogaloop.swf?
clip_id=9553205&amp;server=vimeo.com&amp;show
_title=1&amp;show_byline=1&amp;show_portrait=0&
amp;color=&amp;fullscreen=1" /><embed
src="http://vimeo.com/moogaloop.swf?
clip_id=9553205&amp;server=vimeo.com&amp;show
_title=1&amp;show_byline=1&amp;show_portrait=0&
amp;color=&amp;fullscreen=1" type="application/x-
shockwave-flash" allowfullscreen="true"
allowscriptaccess="always" width="400"
height="320"></embed></object><p><a
href="http://vimeo.com/9553205">Procrastination</a
> from <a
href="http://vimeo.com/johnnykelly">Johnny
Networked Learning 2010
Kelly</a> on <a
href="http://vimeo.com">Vimeo</a>.</p>
Embed HTML Tags

Networked Learning 2010

Online HTML Tutorials

http :// www . w3schools . com / htmL /

Networked Learning 2010

Embedding Documents

With this in mind, documents are typically

uploaded to a document sharing site. Google
lets you view the HTML and copy it into a
balloon, while Scribd.com give you the embed
code to embed the document as an object in
the placemark.

Networked Learning 2010

Lesson Idea
Choose a topic you study in class. Assign
students to research this topic in
different geographic regions, or countries.
Have students write a report using Google
Docs. Student can then share it out and
have at least 2 classmates to do a peer
review. Once reviewed, have the class
create a collaborative layer Google Earth
and embed their papers into geo-located
balloons. Publish the layer and have
student discuss any patterns they see.

Networked Learning 2010

Document Sharing Sites
– Google
Docs
– Scribd.co
m

Networked Learning 2010

Embedding Google Directions
1.Open a browser and
Documents navigate to Google
docs website.
2.Sign in to your account.
3.Click on “New Document”
4.Type your document.
5.Click on the Edit menu
and choose “Edit
HTML”. Google Earth
does not resolve CSS.
6.Highlight and copy the
code.
7.Click on the “yellow
pushpin” to create a
GE placemark.
8.Paste the code into the
“Description” window.
9.Click “OK”.
Google Docs can help you format a paper
and then create the HTML behind it,
which students can embed in a balloon.

Networked Learning 2010

Lesson Idea
Ask younger students to interview a member
of their family who has lived in another
region or country. Have them draw a
picture about what they learned and write
down key facts. For older students you
might ask them to make an advertisement for
that place. Scan them into the computer
and then upload them to Scribd.com. Embed
each document into a balloon and then geo-
locate the balloons to create a
collaborative layer. What common ideas do
they see?
Networked Learning 2010
Embedding
Documents with Directions
1.Open a browser and
navigate to Scribd.com.
Scribd.com 2.Search the database or
Sign in to your
account.
3.Click on “My Documents”
tab if in your
account.
4.Click on the “Share”
button.
5.Copy the “Standard
HTML” code.
6.Click on the “yellow
pushpin” to create a
GE placemark.
7.Paste the code into the
“Description” window.
8.Click “OK”.
9.
Scribddocuments appear very small as a
default. You will need to edit the width
from width=“100%” to an actual width, such
as width=“400”.
Networked Learning 2010
Embedding
Spreadsheets
With this in mind, spreadsheets are typically uploaded to
a document sharing site, then embedded. Google does
not let you view the HTML, but you can create a graph of
the data, publish it and then use the URL image code to
embed the chart in a balloon. If you want to embed the
spreadsheet, you’ll have to upload it to Scribd.com and
embed it as an object.

Networked Learning 2010

Lesson Idea
Have science students collect data on local
vernal ponds over a year. Each student
could be responsible for a pond near their
house. Have them use Google Spreadsheets
to store their data. Then have them create
a chart of the data and publish it. You
could get other schools that you know to
participate. Each student creates a
balloon and embeds their chart as an image.
A project coordinate creates a composite
layer of all participants' balloons.
Students can see if there are any common
problems using the collaborative layer.
Networked Learning 2010
Embedding Google
Directions
1.Open a browser and navigate to
Spreadsheets Google docs website.
2.Sign in to your account.
3.Click on “New Document”
4.Create a spreadsheet.
5.Enter student data from
experiment.
6.Publish the page and allow for
automatic updates.
7.Copy the web address.
8.Open a new tab and paste the
web address into it.
9.Follow the steps for images.
10.Click on the “yellow pushpin”
to create a GE placemark.
11.Paste the code into the
“Description” window.
12.Click “OK”.
Google doesn’t let you see the HTML of
the spread sheet, so you can either
create a graph of the data and embed
the image URL, or upload the
spreadsheet to Scribd.com and then
embed it. Networked Learning 2010
Vernal Ponds Project in Google
Sites
http://sites.google.com/site/vernalpondsproject/

Networked Learning 2010

Embedding
Presentations
With this in mind, presentations are typically
uploaded to a slide sharing site. Google does
not lets you view the HTML and copy it into a
balloon, while SlideShare.net gives you the
embed code to embed the presentation as an
object in the placemark.

Networked Learning 2010

Lesson Idea
Have students collect images on a
significant events in a particular location
at a particular time period. Students can
create a photo album of the event. Place
one image on each slide and have students
write key facts as captions for each image.
Have them upload their presentations to a
slide sharing site. Embed each
presentation in a balloon and then geo-
locate the balloons. Create a composite
layer of all balloons. Add the year to the
title of the balloon to create a tour
through history.
Networked Learning 2010
Favorite Presentation
Sharing Sites

– SlideShare.net
– AuthorStream.
com
Networked Learning 2010
Embedding Presentations
Directions
1.Open a browser and navigate to
slide sharing website, such
as SlideShare.net.
2.Sign in to your account.
3.Upload your presentation.
4.Wait for it to be processed.
5.Click on the presentation an
look for the embed code.
6.Copy the code.
7.Click on the “yellow pushpin”
to create a GE placemark.
8.Paste the code into the
“Description” window.
9.Click “OK”.

Networked Learning 2010

Embedding
VoiceThreads
VoiceThreadsare images that are uploaded to
a server that numerous individuals can attach
a podcast of their experiences related to that
image. With this in mind, VoiceThread provides
embed code that can be placed in a balloon.

Networked Learning 2010

VoiceThread
http://ed.voicethread.com/#home

Networked Learning 2010

Embedding a D ire ctio n s
VoiceThread 1. O p e n a b ro w se r a n d n a vig a te
to V o ice T h re a d w e b site .
2. S ig n in to yo u r a cco u n t.
3. C lick o n “ C re a te ”
4. U p lo a d a n im a g e , o r a se rie s
o f im a g e s.
5. Po d ca st yo u r exp e rie n ce s.
Yo u w ill n e e d a h e a d se t a n d
m icro p h o n e to d o it.
6. C lick o n “ S h a re ” .
7. C o p y th e e m b e d co d e .
8. C lick o n th e “ ye llo w p u sh p in ”
to cre a te a G E p la ce m a rk .
9. Pa ste th e co d e in to th e
“ Description ” window .
10. C lick “ O K ” .

Networked Learning 2010

Lesson Idea
Have students complete a community service
project and take pictures. Have them
upload the images to a VoiceThreadand then
have them comment about their experiences.
They could even host a lunch for the people
who they did the service for, say in a few
months, and then have them comment about
how its helped them.

Networked Learning 2010

Embedding Glogs

Glogsare posters created on the site

Gloggster.com. Students can add art, text
and music to their glogs. With this in
mind, Glogster provides embed code that
can be placed in a balloon.

Networked Learning 2010

Glogster.com
http://www.glogster.com/

Networked Learning 2010

Embedding Directions
1.Open a browser and navigate to
Glogs Glogster website.
2.Sign in to your account.
3.Click on “Create” and create
your glog.
4.Click on “Embed into Your
Page”.
5.Copy the embed code.
6.Click on the “yellow pushpin”
to create a GE placemark.
7.Paste the code into the
“Description” window.
8.Click “OK”.

Glogsare created very large and do not

fit into balloon very well. You will
have to adjust the size of the glog and
the balloon to handle it.

Networked Learning 2010

 Typical Code for a Glog
Embed
<iframe src=


"http://www.glogster.com/glog.php?
glog_id=5547136&scale=100"
width="960" height="1300"
frameborder="0" scrolling="no"
marginheight="0" marginwidth="0"
style="overflow: hidden;"></iframe>
Change the scale to 45.
Change the width and height to ½ the original listed.
Placemarks best appear at no more than 450 width and 600
height.
Networked Learning 2010
Lesson Idea
The student’s family is going to hold a
family reunion this summer and you want
them to use their skills in graphic design
and copy writing to create a poster (glog)
about each side of the family that they can
share with people. They should collect
images and quotes about famous and funny
events that different families have had.
Because these family members live in
different locations around the country,
students can create a layer in Google Earth
of glogs for each family and then share the
composite layer at the reunion.
Networked Learning 2010
Embedding Audio

Audio is the most problematic to embed.

Some players work in Google Earth and
others do not. The best audio sharing site
that I’ve found is Podomatic.

Networked Learning 2010

Audio Sharing Sites
– Podomatic.com
–

Networked Learning 2010

Embedding
Audio D ire ctio n s
1. O p e n a b ro w se r a n d n a vig a te
to Po d o m a tic w e b site .
2. S ig n in to yo u r a cco u n t.
3. C lick o n “ Po st a N e w
E p iso d e ” a n d fo llo w th e ta b s
to cre a te a n d p u b lish yo u r
p o d ca st.
4. Yo u ca n e ve n a d d p h o to
a lb u m s fro m Fa ce b o o k a n d
Flickr.
5. C lick o n “ S h a re ” .
6. C lick o n “ E m b e d a Pla ye r”
7. C lick o n th e “ ye llo w p u sh p in ”
to cre a te a G E p la ce m a rk .
8. Pa ste th e co d e in to th e
“ Description ” window .
9. C lick “ O K ” .

Networked Learning 2010

Lesson Idea
Have students create a podcast series about
events that took place at different time
periods and in different places around the
globe. Students could even dress up in
period costumes or the dress of different
cultures. Create a common class account on
Podomaticand create a history or science
series. Geo-locate the podcasts in the
locations they took places. Use the
composite layer in a younger grade so that
students can learn from their older peers.

Networked Learning 2010