[update: So we might have to put a hold on this. I tried it and the link didn’t work. The shape worked but it didn’t preserve the live link. I’m going to see if I can figure it out but as of right now everything below works except for maintaining the live link in the embed (which was the point for me but might not be for you).]

We were discussing making collage images for a website with links embedded into the image. The example used was a librarian who took a panoramic picture of her library, and then linked the actual sections of the library to that particular catalog, i.e. you click on the actual reference section in the image of the library and you are linked to the reference section catalog. (For the ItsLearning fans out there, this is akin to the hotspot option in the test module.)

I of course envisioned this for maps, artwork, etc. but wondered 1. if it had to be done via GoogleDraw and 2. if it can be used outside of the Google universe (Googleverse?). (I’m not convinced yet that this is the easiest way to do this; I’m trying to figure out if doing it in, say, Acrobat or even Word could work but I’m not there yet.)

Here’s how to do it.

  1. Grab an image (from wherever) and put it into GoogleDrive.
  2. Open GoogleDraw and insert the image into GoogleDraw.
  3. Use the shape tool to highlight a linkable area (say, circle France on a map).
  4. Make sure that the fill and line on that shape is made transparent (so it’s invisible).
  5. Link that shape to wherever you want (website, etc.).
  6. This makes it available to your GoogleSite but not yet to something outside of Google.
  7. To make it available outside of Google, publish it.
  8. Publishing it will make available an embed code, which can then be used elsewhere.