Application Links Browser Start Page

“That’s quite a viewer. I’ve never seen anything quite like it before. What is it?”
“Efficient.”
Sinclair and Kosh in Babylon 5: “The War Prayer”

Okay, not the most creative posting name, but that’s what it’s about. A question about linking to documents in DEVONthink (thanks Max :-)) led me to look into Item Links in DEVONthink. They look like this:

x-devonthink-item://E5488420-8952-4AE1-B651-9D22A407C3E8

and are a lot of HTML links … very much like — and you can do some cool things with them. They work not only for DEVONthink but for other applications as well. This here for example:

application_link_start_page_online_s
The start page in my browser (Firefox). The images are actually one large image (quicker and nicer to load). It was created in Keynote (set the slide size to an useful value, e.g., 1120×650). An image map ensures the links. Yup, the style could be improved (a bit Windows 8’ish) and it’s a little childish, but it’s a nice counterweight. Note that I do not own the copyright, none of the images are mine — they are from games, movies, or deviantART. The photos are just for demonstration purposes (I find it nicer to show actual photos instead of mock-ups), no copyright infringement intended.

This is the start page that is loaded per default in my browser — and it allows me to quickly open specific perspectives in OmniFocus (task manager) or Folders/Groups in DEVONthink (specific file would have worked as well). Something like this:

It does this by using the x-devonthink-item:// links or omnifocus:/// links in the href of the link, like this:

<a href="omnifocus:///perspective/Doing%20Today" alt="OmniFocus: Doing Today">Doing Today</a>

All you need is an image (here: background.png) and an html-file with an image map (created with a text editor like TextWrangler, here: background_start_page.html) with the content:

<html>
<head><title>Startpage</title></head>
<body bgcolor="#000000"><div align="center"><img name="background" src="background.png" width="1120" height="650" border="0" id="background" usemap="#background_map" alt="" /><map name="background_map" id="background_map">
<area shape="rect" coords="0,0,560,325" href="x-devonthink-item://LINKADDRESS" alt="Work Notebooks" />
<area shape="rect" coords="560,0,1120,325" href="x-devonthink-item://LINKADDRESS" alt="Goals" />
<area shape="rect" coords="0,325,280,488" href="omnifocus:///perspective/Doing%20Today" alt="OmniFocus: Doing Today" />
<area shape="rect" coords="0,488,280,670" href="omnifocus:///perspective/Projects" alt="OmniFocus: Projects" />
<area shape="rect" coords="280,325,560,670" href="x-devonthink-item://LINKADDRESS" alt="Reading Notebooks" />
<area shape="rect" coords="560,325,1120,670" href="x-devonthink-item://LINKADDRESS" alt="Private Notebooks" /></map></div></body>
</html>

Note that I have removed the exact address of the x-devonthink-items — you have to put in your own.

Simply put both files (background image and the .html file) in a directory on your computer (NOT in DEVONthink and it must be on the same computer as DEVONthink and OmniFocus) and open the .html file in your browser (just drag it onto the Icon in your dock). You can then go to the preferences and set the current page as default page. Note that it works with any html file. You do not need an image map, I just think that it looks nicer.

Why is this cool?

You can quickly open frequently used folders in DEVONthink and perspectives in your task manager this way. One of the things I miss from the days when I was using a wiki to store my ideas and products was the start page I had created. Did some nice things with JavaScript and the like. I usually use the brower very often during the day (getting articles, information, etc.) so using it as a jump-point to frequently used views or groups in the programs I use on my Mac makes sense. I no longer have to go do DEVONthink, select a specific database and then the folder and file but can do it much more quickly from this starting page. And given that I use a Gaming Mouse with buttons for — e.g., closing a window and a double-click button, I can access the file very quickly and close the window when I no longer need it. It takes some of the friction out of frequently reoccurring tasks.

How do you get the links?

So far, I have seen these kinds of links in DEVONthink, OmniFocus (thanks to an Asian Efficiency Posting), and Papers 2 (currently testing it). In …

  • DEVONthink: Right-click on the file or folder you want to link to, then select “Copy Item Link”. If you link to a file that DEVONthink cannot open natively, you see a DEVONthink window with the file in it. You have to open it externally then (shift+command+O works).
  • OmniFocus: As this Asian Efficiency Posting shows, its simply omnifocus:///perspective/PERSPECTIVENAME — if your perspective name includes a space, replace this with a %20.
  • Papers 2: Right-Click on the article and select “Copy As” and then “Papers Link”, it gives you something like papers2://publication/doi/10.1542/peds.2012-2204

There are probably other applications as well, but these three are the store houses for most of my work at the moment and the ones I use most frequently.

Works in other applications as well … and very well, but BE CAREFUL!

Note that you can use these links in many other applications as well (I suppose in a lot of them as long as they support HTML links). The original reader question was about referring to documents in DEVONthink from Circus Ponies Notebook documents. It works without problems. Copy and paste the Item link from DEVONthink to Circus Ponies Notebook and it works (see below). You can also add these links in the URL field of an iCal entry (e.g., if you need a specific folder when the alarm sounds), or in a the notes field of an OmniFocus entry (as the Asian Efficiency Posting recommends). You can even create a bookmark in Firefox (e.g., in the bookmarks toolbar) and use the link as URL.

Note that if you refer to documents, e.g., in DEVONthink, make sure that you can understand the links if something happens with DEVONthink. A link like

x-devonthink-item://E5488420-8952-4AE1-B651-9D22A407C3E8

does not tell you anything about the document you meant. When you copy and paste the “Copy Item Link” from DEVONthink into Circus Ponies Notebook, you get a link where the link text is the name of the document — if you use the normal paste (cmd + v). Circus Ponies Notebook has other kinds of paste that lead to different results (see image):

test_cpn_link
The effects of pasting text into Circus Ponies Notebook depend on the way it is pasted. See the menu (edit – paste – …) for options. The normal paste gives you a nice link where the document name is the link text and the x-devonthink-item is the link itself. But make sure that the document name means something to you! Links get broken!

In any case, make sure that that name means something to you, e.g., if its an article, use the authorname_(authorname_)year name convention in DEVONthink!

4 Comments

  1. This is genius! Love this idea. I’m going to try this myself too (and not get tempted to use half-naked women as images).

  2. Yeah, this is one of my eternal struggles in posting about organizing creativity — do I show what I actually use or do I tune it down for online consumption. I always find it disappointing if people show pictures of their workspace sanitized for public consumption … I think some things are lost. And in this case I regarded the images as not that problematic (they are all clothed, including the Luis Royo painting, so I guess they are SFW). And frankly I rather look at beautiful women (as contrast to the black-and-white desert of letters in the papers I read). Hmmm, and I guess, so do you … like you said “For guys, a beautiful girl is optional.” 😉

  3. I do not know about OmniFocus, but there are scripts that automatically put these links into task entries for Things or into Calendar events. By using Automator you can even assign scripts to system-wide hot keys (system services with dedicated key combination). So for the most frequent options, you do not ecen need to manually show, copy and paste these links.

  4. Hoi Luc,

    hmmm … I’m not that familiar with scripts, but this sounds like a cool idea. If you assign hotkeys to these links, they would be quickly available … yes … hmmmm … good point.

    All the best

    Daniel

2 Trackbacks / Pingbacks

  1. Customized Screen Backgrounds | ORGANIZING CREATIVITY
  2. Circus Ponies Notebook Alternative – OmniOutliner | ORGANIZING CREATIVITY

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.