Blogs at Penn State Community

You can embed many media objects within your blog site including YouTube Videos, your personal Flickr Photos and other objects by including the "HTML Embed code" within your blog entry

Note: In order for the embed codes to work, you must switch your entry format from Rich Text to one showing HTML tags such as None.

YouTube

1. Log on to http://blogs.psu.edu and create a New Entry.
2. Write and format the text for the body of your entry.
   Note: The easiest approach is the describe the video first, then insert it.
3. Click the <A> HTML Mode button. You will see the HTML tags for your entry.
4. Open a new browser window and search for a video on YouTube.
   Note: Please be sure that the YouTube is free of copyright issues.
5. Look for the Embed code on the YouTube page and cut and paste it into the text body.
   Note: The embed code begins as "<object width =..."
6. Save and publish the entry. The video stream will be displayed in your blog.
   Note: If the entry shows the code instead of the video, make sure your Format is NOT Rich Text.

FlickrPhotos

These instructions only work for your own Flickr photos.

1. Upload any image files you wish to post on to your blog into your Flickr account.
2. Log on to http://blogs.psu.edu and create a New Entry.
3. Write and format the text for the body of your entry.
   Note: The easiest approach is the describe the photos first, then insert them.
4. Click the <A> HTML Mode button. You will see the HTML tags for your entry.
5. Open a new browser window and search for the uploaded Flickr photo.
6. Select the All Sizes button in the Flickr Toolbar and selct the appropriate size.
7. Save and publish the entry. Your Flickr photo will be displayed in your blog.
   Note: If the entry shows the code instead of the photo, make sure are outside WYSIWYG mode.

Google Maps

These instructions only work for your own Google Maps and Google Maps released to the public.

1. Create a custom Google Map following the Google MyMaps Instructions.
2. Click Link to this Map in the upper right, then click Customize and preview embedded map
3. Set the zoom and location in the preview window to the appropriate settings.
4. Log on to http://blogs.psu.edu and create a New Entry.
5. Write and format the text for the body of your entry.
   Note: The easiest approach is the describe the map first, then insert it.
6. Click the <A> HTML Mode button. You will see the HTML tags for your entry.
7. Close the window, then cut and post the HTML code into your blog entry. The code looks something like

   <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?f=q&hl=en&geocode=&q=16805&ie=UTF8&om=1&s=AARTsJpP8HuZttzsTmaO5qSXfC_JN95p2w&ll=40.822643,-77.844315&spn=0.181863,0.291824&z=11&iwloc=addr&output=embed">
   </iframe><br />
   <small><a href="http://maps.google.com/maps?f=q&hl=en&geocode=&q=16805&ie=UTF8&om=1&ll=40.822643,-77.844315&spn=0.181863,0.291824&z=11&iwloc=addr&source=embed" style="color:#0000FF;text-align:left">View Larger Map</a></small>

See Google Maps for instructions with screen captures.

Other Content

The capability of embedding content from other sites depends on whether they release an embed code or not. Some sites may only allow you to embed your own items.