My contribution to Chris Siebold's new book, Mac Hacks: Tips and Tools for Unlocking the Power of OS X" describes how to make your Mac know when you're nearby--and then do your bidding. If you're a Mac user, you'll find over 50 more cool things to try.

I've been itching to try my hand at creating a "workflow" for Alfred 2, so I decided to adapt my script that creates a fully-specified HTML img tag for any type of image file.

Creating this workflow was more work than I thought it would be. (But it was fun.) That's partly because Alfred 2 is new, so there are a limited number of examples to learn from, but also because the feature is only "documented" in a user forum. (Which is active and helpful, nonetheless.)

To use this workflow, invoke Alfred 2 and type "mapimg," then press Tab. Now type the first few characters of the name of the graphic file, then press Return.

The workflow will extract the width and height of the image, then put a fully-written img tag on the clipboard. The output looks like this:

< img src="http://www.chicagomagicstudio.com/map/gfx/ShawMahatma1895.png" width="366" height="183" >< /br>TITLE

Now this workflow definitely won't be useful to you as-is. It's hardcoded to create exactly what I need for one of my websites, and it won't be what you need. I'm sharing it with the spirit and hope that one or more of its pieces will be useful for others.

To that end, here are some details about its implementation.

• The workflow is configured so that the only acceptable parameters are jpeg, png, and gif images. Also, it's only searching the folder where I stage files for my web server. You'll definitely need to change the latter; do so Search Scope tab of the File Filter action.
• The Copy to Clipboard action will optionally paste the results into the frontmost application. This is a great feature, but I opted not to use it because I don't want the additional cognitive overhead of having to set the cursor location before invoking the workflow.
• In addition to changing the website path that's hardcoded in the script, you'll probably want to eliminate the trailing line break and placeholder "TITLE" that I add. Adding alt text is left as an exercise for you, too.
• The trigger name I use, "mapimg," reflects that this is creating a link for my Map of Chicago Magic website. That's what the workflow icon reflects, too. If I create a version of this for another of my sites, I'll use a specific name for that one too. Ideally, there would be one workflow that asked which website path to use, but I didn't try to figure that out. If you do, please let me know.

Finally, let me add that I'm really pleased with Alfred 2. I started using Alfred less than a year ago, having been a LaunchBar user since Mac OS X 10.0, and I'm looking forward to the workflows that others share. I hope you find mine useful; download it using the link below.

Download the mapimg workflow.

For me, one of the most tedious parts of writing HTML is the img tag. Specifically, filling in the width and height parameters. This is compounded by having to figure out the image's dimensions. OS X's Quick Look feature makes this a little easier because it displays the dimensions in the title bar, but you still have to remember if they're displayed in width/height or height/width order. (It's the former, by the way.)

Now this isn't exactly digging ditches, so pardon my white collar whine, but I finally had enough of doing all this by hand so I wrote a script to automate the process. You pass the script an image file and it outputs a complete tag, ready for inserting in your HTML. The output looks like this:

< img src="http://www.chicagomagicstudio.com/map/gfx/ShawMahatma1895.png" width="366" height="183" >< /br>TITLE

Since my primary motivation in creating this is laziness, I made the script output the exact img tag that I need. It includes the path to the graphics file on my website, and the placeholder "TITLE" and linefeed. You'll obviously want to change these for your site. Adding an alt tag is left as an exercise for the reader.

You can download my imgref script from github. I hope you find it useful.

It's fantastic to see that Philips has made good on their promise to document the API for Hue. Let the fun begin.

See also: A Word About Hue