Create and Share IIIF Items Quickly and Easily with Drag and Drop over Email

Drew Winget
3 min readMay 10, 2016

--

There has been a lot of excitement in the IIIF community recently surrounding the appearance of drag-and-drop icons in several major digital collection catalogues. If you visit the Yale Center for British Art, e-codices, the Digital Bodleian, and other major online catalogues, you’ll see this icon:

Just Drag and Drop

If you have an instance of Mirador running, you can drag and drop one of these icons directly into a blank workspace area to open them in the same environment. It works with images and manifests, whether they are image collections or books.

Mirador and Universal Viewer both support drag-and-drop icons from IIIF catalogues. Creating an image that can be dragged this way is dead simple, and will help scholars, students, and anyone else make the most out of cultural heritage resources. Here’s how it works.

Drag and drop uses the browser’s built-in dataTransfer API. If you’re adding drag-and-drop icons to a website, just wrap an image of the IIIF logo in an anchor tag and giving it an href.

For non-programmers out there: this is just a link. If we look at the URL for this icon link, we’ll see two parts, separated by a question mark.

The first part is the page you want your recipients to visit if they click the icon:

http://mirador.britishart.yale.edu/?manifest=http://manifests.britishart.yale.edu/manifest/1079

This next part, after the question mark, is the link to your object’s manifest.json file or, for images, info.json file.

http://mirador.britishart.yale.edu/?manifest=http://manifests.britishart.yale.edu/manifest/1079

The word “manifest=” here tells Mirador and other viewers what to do with your icon, and the url points to a IIIF manifest (for groups of images), or an info.json file for ungrouped images. Almost all IIIF catalogues provide this kind of url to represent their assets in results pages, even if they don’t yet provide drag-and-drop icons.

It only recently occurred to me that this format is well-contained and simple-enough that you can actually do this in an email. Simply:

  1. Add an image to your email
  2. Highlight it like you would a section of text
  3. Add a link (with ⌘ + K/ Ctrl + K) from the toolbar.

Since Internet Archive has made all their items available over IIIF, here’s an example with a nice dual-language scan of Plato. Check it out:

I hope this will help colleagues share and discuss great works more fluently in the software they use most. Let me know what you think, and how you might use it. Also, let others know if you provide IIIF endpoints, or draggable icons, in your repository pages.

--

--