It was a very last-minute request, but the fine folks at Matrix were able to accomodate my last-minute request to add IFrame embedding support to the DayOfDH network blog (by default iframe tags are stripped out of WordPress posts). And they did it remarkably quickly – thanks! We won’t think too much about the security implications, m’kay? 🙂

I’m sure my motivations for requesting this won’t be a mystery for most of you – I wanted to have the possibility of embedding Voyant Tools into my posts. Voyant supports the ability to embed interactive tools into remote sites, much like you would embed a YouTube clip.

I thought it might be useful to provide a very quick tutorial for how to embed Voyant tools into your DayOfDH blog post.

The easiest form is to just add a line like this to your blog post (this can be done in the visual or text editor, it doesn’t matter):

[iframe src='http://voyant-tools.org/tool/Cirrus/?useReferer=true&stopList=stop.en.taporware.txt' style="width: 400px; height: 400px"]

Note that when you preview your post (before publishing it), the tool may not show proper content because the content won’t yet be accessible to Voyant before you publish it. Once you publish your post you should be able to double-check that the content looks plausible.

The iframe plugin works by identifying the pattern [iframe src="…" …] and expanding it to a proper HTML form like <iframe src="…" …></iframe>.

You can specify the dimensions of the embedded tool using the style attribute, as well as specifying that the tool should appear floating relative to the rest of the content.

[iframe src='http://voyant-tools.org/tool/Links/?useReferer=true&stopList=stop.en.taporware.txt' style="width: 350px; height: 350px; float: right"]

Easy, right?

The ?useReferer=true part of the src attribute tells Voyant to fetch the contents of the page where the tool is embedded – that avoids the need to specify a full URL. This is very convenient, but it should be noted that the contents of the URL are only fetched once, the underlying corpus won’t change even if the original contents of the embedding web page change. If it’s important to have content updated, you can specify an input URL (note that this is very inefficient for everyone involved since the URL contents are fetched every time someone visits your page – but sometimes ya gotta do what ya gotta do):

[iframe src='http://voyant-tools.org/tool/Cirrus/input=http://dayofdh2013.matrix.msu.edu/sgsinclair/2013/04/07/embedding-voyant&stopList=stop.en.taporware.txt/' style="width: 350px; height: 350px;"]

Similarly, you’re not limited to just embedding at tool about the current contents, you might also want to show all of the posts in an RSS feed. Note the inputFormat=RSS2 and splitDocuments=true parameters here that tell Voyant to build a corpus of individual documents based on each post in a standard RSS fee.

[iframe src='http://voyant-tools.org/tool/Cirrus/?input=http://dayofdh2013.matrix.msu.edu/sgsinclair/feed/&inputFormat=RSS2&splitDocuments=true&stopList=stop.en.taporware.txt' style="width: 350px; height: 350px;"]

But Sinclair, you say to me, don’t you know that word-clouds are nefarious – don’t you have something else to offer? Why sure, you might be interested in replacing the Cirrus part of the URLs above with one of the following:

• TypeFrequenciesChart for graphing distribution top terms
• Bubblelines for graphing overlap of top terms
• Links for graphing collocates (words in proximity) for top terms
• Knots for graphing repetition of top terms

Some of the other tools are documented here.

Oh, and DayOfDH might be a good day to launch a new tool, don’t you think? Stay tuned :).