{"id":841,"date":"2010-10-11T18:43:00","date_gmt":"2010-10-11T22:43:00","guid":{"rendered":"http:\/\/patorjk.com\/blog\/?p=841"},"modified":"2014-01-25T17:40:55","modified_gmt":"2014-01-25T21:40:55","slug":"image-definitions-for-dictionaries","status":"publish","type":"post","link":"https:\/\/patorjk.com\/blog\/2010\/10\/11\/image-definitions-for-dictionaries\/","title":{"rendered":"Google Dictionary + Urban Dictionary + Flickr API"},"content":{"rendered":"

One of the characteristics of web browser extensions that excites me is that you can write plug-ins for your favorite websites. For my next extension I wanted to create something that was a plug-in to a specific website or websites. After mulling over possible ideas, I decided to create an extension would augment the definitions from dictionary websites with relevant images. The result is Image Definitions for Dictionaries<\/a>, which is a Chrome web browser extension that augments the results of Google Dictionary<\/a>, Google Search<\/a>, and Urban Dictionary<\/a> with images from Flickr<\/a>.<\/p>\n

\"\"
Image From Homer Defined<\/a><\/figcaption><\/figure>The idea for this extension came from an episode of the Simpsons where Homer is repeatedly defined in the dictionary, with his picture appearing next to certain words. I thought it would be interesting if that’s how all dictionaries worked. They would have an image next to the word they were defining and that image would be determined by what the web thought was most relevant. I thought this would especially be interesting for the more eccentric dictionaries like Urban Dictionary. Urban Dictionary does already have an image feature, but it’s based on user uploads and isn’t heavily used.<\/p>\n

After playing around for a little bit, I had an extension that worked for the previously mentioned sites. Below you can see a slideshow which lets you see how the Flickr thumbnails are integrated into the dictionary webpages (clicking on a thumbnail within a dictionary site will take you to the image’s Flickr page):<\/p>\n\n\t