embedding images, video, documents, spreadsheets, slide presentations, audio files, glogs from Glogster and VoiceThreads into Google Earth balloons

1. Networked Learning http://www.thenetworkedlearner.com Google Earth TutorialsPart V – Embedding ObjectsHosts – Thomas Cooper, Alice Barr Networked Learning 2010

2. Embedding Images With this in mind, images are typically uploaded to a photosharing site. The URL address of the images is referenced from the image and then displayed in the Google Earth balloon. Networked Learning 2010

3. Favorite PhotosharingSites Photosharing Sites Photobucket Web Picassa (Google) Flickr Facebook * Images need to be stored online in order for Google Earth to reference them through the XHTML code. Networked Learning 2010

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

5. What the HTML Code is About Main Image Tag <imgsrc=“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 slash. Some HTML code tags, such as images don’t have closing tags. There are really few . Networked Learning 2010

6. 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

7. Favorite Video Sharing Sites Vimeo YouTube Google Video TeacherTube Networked Learning 2010

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

9. 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&server=vimeo.com&show_title=1&show_byline=1&show_portrait=0&color=&fullscreen=1" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=9553205&server=vimeo.com&show_title=1&show_byline=1&show_portrait=0&color=&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 Kelly</a> on <a href="http://vimeo.com">Vimeo</a>.</p> Networked Learning 2010

10. Embed HTML Tags Networked Learning 2010

11. Online HTML Tutorials http://www.w3schools.com/htmL/ Networked Learning 2010

12. 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

13. 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

14. Document Sharing Sites Google Docs Scribd.com Networked Learning 2010

15. Embedding Google Documents Directions Open a browser and navigate to Google docs website. Sign in to your account. Click on “New Document” Type your document. Click on the Edit menu and choose “Edit HTML”. Google Earth does not resolve CSS. Highlight and copy the code. Click on the “yellow pushpin” to create a GE placemark. Paste the code into the “Description” window. 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

16. 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

17. Embedding Documents with Scribd.com Directions Open a browser and navigate to Scribd.com. Search the database or Sign in to your account. Click on “My Documents” tab if in your account. Click on the “Share” button. Copy the “Standard HTML” code. Click on the “yellow pushpin” to create a GE placemark. Paste the code into the “Description” window. Click “OK”. Scribd documents 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

18. 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

19. 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

20. Embedding Google Spreadsheets Directions Open a browser and navigate to Google docs website. Sign in to your account. Click on “New Document” Create a spreadsheet. Enter student data from experiment. Publish the page and allow for automatic updates. Copy the web address. Open a new tab and paste the web address into it. Follow the steps for images. Click on the “yellow pushpin” to create a GE placemark. Paste the code into the “Description” window. 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

21. Vernal Ponds Project in Google Siteshttp://sites.google.com/site/vernalpondsproject/ Networked Learning 2010

22. 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

23. 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

24. Favorite Presentation Sharing Sites SlideShare.net AuthorStream.com Networked Learning 2010

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

26. Embedding VoiceThreads VoiceThreads are 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

27. VoiceThread http://ed.voicethread.com/#home Networked Learning 2010

28. Embedding a VoiceThread Directions Open a browser and navigate to VoiceThreadwebsite. Sign in to your account. Click on “Create” Upload an image, or a series of images. Podcast your experiences. You will need a headset and microphone to do it. Click on “Share”. Copy the embed code. Click on the “yellow pushpin” to create a GE placemark. Paste the code into the “Description” window. Click “OK”. Networked Learning 2010

29. Lesson Idea Have students complete a community service project and take pictures. Have them upload the images to a VoiceThread and 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

30. Embedding Glogs Glogs are 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

31. Glogster.comhttp://www.glogster.com/ Networked Learning 2010

32. Embedding Glogs Directions Open a browser and navigate to Glogsterwebsite. Sign in to your account. Click on “Create” and create your glog. Click on “Embed into Your Page”. Copy the embed code. Click on the “yellow pushpin” to create a GE placemark. Paste the code into the “Description” window. Click “OK”. Glogs are 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

33. Typical Code for a Glog Embed <iframesrc= "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

34. 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

35. 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

36. Audio Sharing Sites Podomatic.com Networked Learning 2010

37. Embedding Audio Directions Open a browser and navigate to Podomaticwebsite. Sign in to your account. Click on “Post a New Episode” and follow the tabs to create and publish your podcast. You can even add photo albums from Facebook and Flickr. Click on “Share”. Click on “Embed a Player” Click on the “yellow pushpin” to create a GE placemark. Paste the code into the “Description” window. Click “OK”. Networked Learning 2010

38. 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 Podomatic and 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