Tag: projects

I spent some time this week working on a utility to allow me to display Flickr photos on my own site with their annotations (or “notes”, as Flickr calls them) intact. It required that I learn a bunch more Javascript and CSS, but I think the end result is pretty satisfying. I’m calling it Mbedr. Here’s an example:

Unfortunately, since it uses iframes, I don’t think it’ll work on Livejournal. But it should work fine in WordPress, and anywhere else that doesn’t strip iframes. Update: I switched to using <object> instead of <iframe>, and I think it should work with livejournal now.

I’ve tested it on Firefox and Safari for Mac, and IE7 for Windows. After a bit of weirdness with IE, I think it’s working the way I want it to. If you use a different browser and the example on the project page doesn’t work for you, could you let me know? Thanks!

Update 2011.09.07 – I changed things so that instead of choosing a scaling factor by which the “medium” size get shrunk, you can now choose one of Flickr’s preset image sizes: small, medium, medium 640, large, and original. Old URLs will continue to work and scale the medium image, newly created embed codes will use the preset sizes. If you need a very specific size for an embedded image, resize your image to the dimensions required, upload that as a new original photo, and add notes to it. Then use the “Original” option in Mbedr.

NB: Flickr resizes the largest side of an image down to the dimension of its preset sizes. That is, if a preset size is 500 pixels (as “medium” is), the image will be resized to fit entirely within a 500×500 box.