Adding images to Textivate from Google Drive

Those familiar with textivate's more advanced features will be aware that you can set up image-based matching activities which match images with text items. They will also be aware that the images have to be hosted elsewhere (i.e. there's no facility to upload them to textivate...)

Until recently, our blog post / user-guide on adding images only listed 2 options for image hosting: IMGUR and DropBox.

Google Drive was never listed as an option because the share link that you typically get for files hosted on Google Drive is a link to a page containing the file rather than to the file itself. But I recently discovered (thanks to Dwight Hensler, of Haven of Peace Academy, Tanzania) that there is a way of getting a direct file link. Here's how...

1. Right-click the image in Google Drive and click on "Get link" (see below)

2. Make sure the share info is set to Public / Anyone with the link

If when you click to get the share link, you see that the sharing is "Restricted" (see below)...

... click on the little down-arrow and change it to "Anyone with the link" (see below)

3. Copy the image ID from the share link

As I said previously, the link that is provided at this stage points to a page hosting the image, rather than to the image itself. So you need to copy just the image ID from the URL. To do this, I find it works best to double-click the image ID part of the URL twice (first time it selects the whole URL, second time just the image ID) so that it is selected as shown in the image below:

Use ctrl+C or right-click and copy to copy the Image ID.

4. Paste the ID into a new link that points directly to the image

So you need to use that ID from the previous step, but in a different URL, which looks like this:

https://drive.google.com/thumbnail?id=YourImageID

In fact you can save yourself a bit of time by copying and pasting the following line into the Textivate text editor as many times as there are images for your resource, and then selecting and pasting or over-writing the relevant parts:

[img]https://drive.google.com/thumbnail?id=YourImageID[/img]==YourMatchingText

For each row of the above items, double-click YourImageID and paste into it the image ID that you copied. Then double-click YourMatchingText and type or paste in your matching text that goes with that image.

Good, eh? 

:0)