Wylio – Embedding Creative Commons Images & Attribution Made Easy!

Introducing Wylio.com **** Updated scroll to bottom****

To use when you need to embed a Creative Commons image in a blog post.

This site is SO simple, so easy and only 4 steps from finding a creative commons image to embedding it in a post for your blog!!

Step 1

Free Pictures - Wylio.com

Step 2

Step 2

Step 3


Step 4

step 4
All images uploaded with Skitch!

You can still use compfight – but wylio is so much easier for embedding creative commons images & the bonus is the attribution is done for you – all in only 4 EASY steps!


Wylio.com - free pictures

Of course, in this ever changing world of technology – Wylio has changed slightly since I first posted about it!
Due to it’s growing popularity ….. Wylio now requires you to create a free account & login to use.  You can use your google account if you have one!

My advice, for classroom teachers would be to create a class google account for Wylio – one email address, one password – for the whole class to remember.
(A class google account can come in handy for all kinds of other things in the classroom – another blog post for later).

Using Compfight, Downloading Images & Giving Attribution

These instructions are only if you need to download creative commons images to your desktop to use in another programme on your computer – such as KeyNote, PowerPoint, iMovie, Word, SMARTNotebook etc.

(These instructions refer specifically to PowerPoint, but can be applied to other programmes.)

If you are looking for Creative Commons images to use on your blog, (in a prezi or anything else that’s online and can take embed code) – check out this post with instructions instead.

  1. Open Firefox.  Type this URL in the address – compfight.com
  2. Microsoft Word-1
  3. Type in your search word (keyword) and click search
  4. VERY IMPORTANT! (see arrows for the settings)
    Make sure Creative Commons, Safe Search & Show originals are black (not blue)
    Don’t click on the Shutterstock images (on the right-hand side) they aren’t free!

  5. Click on the image you like (a new tab will open).

    Image search for white clouds | Compfight | A Flickr™ Search Tool

    Download Steps

  1. Click on the Action button; scroll down to View all sizes.
  2. Make sure the size is at least 600 x 600 (or bigger). Sometimes it’s called the Large or the Original size
  3. Click on the Download link.
  4. All sizes | DSCN2106 | Flickr - Photo Sharing!-1

    This dialogue box will open:


    Make sure the dot is in the “Open with” circle.  Click OKWAIT for the photo to open.

  6. Click File, scroll down to click on Save As …
  7. Rename the file (what is the photo?). Make sure you keep the .jpg (file extension).
    Save to Desktop.  Click Save.Save Image

    Close the photo file & the download box but DO NOT close Firefox

  8. Use the back button on Firefox.
  9. backbutton

  10. Highlight and copy (command c) the URL of the image you have used.
  11. url highlight

  12. Use the F3 key on the keyboard to find your PowerPoint.
    Paste the URL on the last slide. (Attribution Slide)
    Use the F3 key to go back to the flickr page.
    Find the name of the owner of the image. (top right hand side)
  13. Ever wondered why blue jeans and white shirt is such a timeless classic combination? | Flickr - Photo Sharing!

  14. Write that name on the PowerPoint slide too. (see below)

Remember – proper Attribution (giving credit to the owner of a piece of work) means:

  • Write down their Name (either Real Name or Online Name)
  • Include a link (URL) to where you found their work

You can download a PDF version of these instructions here:  Using Compfight

Embedding a YouTube Video

These are the steps for embedding YouTube videos from our school/class YouTube account.  Please log into the class/school YouTube Account first.   Many classrooms have their own YouTube account. (Ask your teacher for the class username and password)
You can embed any other YouTube video in your blog without logging into the class/school account (as long as it is appropriate to your learning).  Skip steps 1-3 and begin at Step 4.
Do not use the URL that has an extra dot in the URL as it will not embed using the YouTube magic button.  (See the extra dot below)

Step 1: Log into YouTube account (in this case it’s *Ms Terry’s Class)YouTube - Broadcast Yourself.


Step 2: Go to MyVideos
YouTube - techcoachisb's Channel

Step 3: Find the Video you want to embed

YouTube - Broadcast Yourself.

Step 4: Copy the URL

YouTube - Adding Flickr Badge to your Blog

Step 5: Embed Button for YouTube Videos

Edit Post ‹ Virtual Room 231 — WordPress
Step 6:  Check the code & Preview the Post
Add New Post ‹ Virtual Room 231 — WordPress

Step 7:  Close the preview tab, you should be back on your post, click Publish!

Google Maps

Grade 5 is using Google Maps to track environmental/sustainability issues that impact on our world.  Using green, red or yellow markers, (positive, negative or neutral impact) students will be using global news sites to keep a record of what issues are occurring in the world with regard to sustainability. Each placemarker has a brief summary about what the issue is, where it’s occurring and what impact it is having on our world.

An example from last year
(click on the link below the map to view in a larger map – it’s better!)

View Sustainability News RM231 in a larger map

How to log into Google Maps and begin to edit the map:

Google Maps1
Uploaded with Skitch!
Google Maps2
Uploaded with Skitch!
Uploaded with Skitch!
Uploaded with Skitch!
Uploaded with Skitch!

Learning to use Google Earth

Today in Grade 4, we’re learning to use the basics of Google Earth.

We will need to copy and paste this address into Google Earth for the quiz:
1600 Amphitheatre Parkway, Mountain View, CA

The following diagram describes some of the features available in the main window of Google Earth:

Overview of Google Earth

  1. Search panel – Use this to find places and directions and manage search results. Google Earth EC may display additional tabs here.
  2. 3D Viewer – View the globe and its terrain in this window.
  3. Toolbar buttons – See ‘Using the Navigation Controls’.
  4. Navigation controls – Use these to zoom, look and move around (see below).
  5. Layers panel – Use this to display points of interest.
  6. Places panel – Use this to locate, save, organize and revisit placemarks.
  7. Earth Gallery – Click this to import exciting content from the Earth Gallery
  8. Status bar – View coordinate, elevation, imagery date and streaming status here.
  9. Overview map – Use this for an additional perspective of the Earth.

Creating a New Placemark


How to add a new placemark to any spot in the viewer

Position the 3D viewer to contain the spot you want to placemark. Consider zooming into the best viewing level for the desired location. Choose any one of the following methods:

  • Select Placemark from the ‘Add’ Menu.
  • Click the Placemark icon on the toolbar menu at the the top of the screen

Pushpin icon
The ‘New Placemark’ dialog box appears and a ‘New Placemark’ icon is centered in the viewer inside a flashing yellow square. Position the placemark. To do this, position the cursor on the placemark until the cursor changes to a pointing finger and drag it to the desired location. The cursor changes to a finger pointing icon to indicate that you can move the placemark.

Position the placemark
You can also lock the placemark position or set advanced coordinates for its position. Set the following properties for the new placemark:

  • Name for the placemark
  • Description, including HTML text (see Writing Descriptions)
  • Style, Color – Choose a color, scale (size) and opacity for the placemark icon
  • View – Choose a position for the placemark. For explanation of terms in this tab, mouse over each field. Click Snapshot current view to apply the current view (altitude and camera angle) to this placemark.
  • Altitude – Choose the height of the placemark as it appears over terrain with a numeric value or the slider. Choose ‘Extend to ground’ to show the placemark attached to a line anchored to the ground.
  • (Icon) – Click the icon for the placemark (top right corner of the dialog box) to choose an alternate icon.

Click OK to apply the information you entered in the placemark dialog box.

Your placemark appears in the 3D viewer and as an entry in the selected folder. Once you save this placemark, you can always change its position and properties. See Editing Places and Folders for more information.

(taken from: Google Earth Support)

Embed a Video

Since the WordPress 3.0 update, security has been tightened up regarding the use of embedding html code that begins with “iframe” or “object”.  That means you can no longer embed anything that begins with those two words.

Below is a tutorial on how to now embed a YouTube video.  It’s WAY easier than it was before – honest!  Check out the video below!

[youtube width=”600″ height=”400″]http://www.youtube.com/watch?v=1F8PpxWk228[/youtube]

The instructions are pretty much the same for any videos from google, vimeo or bliptv too – just use the associated button on the visual editor.
Add New Post ‹ Room 231 — WordPress

Embedding images (using html code) is exactly the same as before! That code doesn’t start with “iframe” or “object” – so just paste the html code into the html editor, then switch back to the visual editor to make size or alignment adjustments.