March 24th, 2007

Syntax Highlighting in Keynote

You would think that adding syntax highlighted code to your Keynote presentations would be as simple as copying & pasting from Textmate. Unfortunately that is not the case as Textmate doesn’t include formatting when copying items to the clipboard. There is however a solution by using some of the included bundles.

Here is my 4 step guide to including syntax highlighted code from Textmate into Keynote.

Step 1: Generate HTML

Open the document containing the code you would like to include. From the menubar select Bundles -> Textmate -> Generate HTML from Document (with line numbers). This will create an HTML document containing both the source code, as well as the stylesheet to match your current Textmate theme.

Step 2: Preview HTML

With the HTML window in focus select Window -> Show Web Preview. This will render the HTML in an embedded Safari window.

Step 3: Copy

You can now copy the rendered HTML, which will include all of the style information.

Step 4: Paste

Paste the copied HTML view into Keynote giving you syntax highlighted code which you can include in your slides.


Comments

Ian Baird says:

March 25, 2007 @ 08:49 AM

Crazy kids and their TextMate. I remember back in the day, in the UNIX lab when you had to use a2ps to get syntax highlighted text...

bbum says:

April 03, 2007 @ 09:58 PM

Fantastic. Look for the product of this trick at WWDC. :)

Patrick says:

April 04, 2007 @ 06:03 AM

Thanks for this great tip. Greetings

Josh Knowles says:

April 04, 2007 @ 09:50 AM

@bbum Looking forward to it! @Patrick - Greetings, glad the tip helped!