Advanced Tools for Wordpress: Part 2

This is part 2 in my series on advanced tools for Wordpress blogging. We’re in the middle of covering TextMate and today I’m going to go over some basic customizations that apply to blogging. To be honest, I might never get past TextMate. There’s sooooo much to explore. For those who are just jumping in on this, TextMate is a text editor for OS X on the Mac platform, and has built in blogging capabilities in addition to a veritable plethora of coding and editing features. I’m currently using it to code HTML posts for this blog (and switching my entire design firm from Dreamweaver to a new setup with TextMate at the center of it, but that’s another series…). So for this post to do you much good, you need the following: A Mac, TextMate (trial version available) and a blog.

The tricks I’m going to use can be applied to the Markdown, Text and Textile scopes of TextMate as well, and can post to any blog platform that TextMate supports. So you don’t have to be a Wordpress user. If you’re still interested, read on…

Basic navigation

It takes some time to get really good at TextMate, and no, I’m not there yet. But I get better every day. Little things like learning that hitting Command-Enter in the middle of a line will skip to the end of the line of text (even if it wraps) and start a new line, make navigating while typing so much easier. Just like using Photoshop, the more keystrokes you learn, the faster you can work. A few of my favorites:

You can scroll up and down by holding down CTRL-OPT-CMD and using the up and down arrow keys

CMD-F2 sets a bookmark on the current line, allowing you to jump through your document to important places, or return to where you were editing after scrolling up to check something above… You can also just click in the column on the left.

You can have a lot of fun holding down the option key and using the arrow keys. When editing a blog, it’s most useful if you CMD-left to get to the beginning of a line and then OPT-up or down to jump between paragraphs.

I’m learning new tricks pretty much every time I sit down at the computer, and these are just a few from the first day. Don’t let me make you think it’s all ninny stuff. It’ll get more advanced. Let’s customize a little.

Snippets are fun!

Snippets are the next level of TextMate power, in my opinion. They are very effective when combined with TAB-triggers so that you can type a sequence, hit TAB and it will run the snippet. A snippet can be very advanced. I have one that when I type “cat” and hit tab, it polls my blog for available categories and presents me with a drop down list that I can choose from. It removes the chosen category from the list and repeats the process until I click “done”. Then it inserts the chosen categories in the headers for the post I’m working on. So Snippets can do anything from complete a long word to advanced network activities. I’ll put the code for the category function out later.

I’m going to show you a quick Snippet customization that you can use right now. A lot of times when I’m working in HTML, whether it’s for the blog or a web site, I’ll want to define a div with both an id and class. Sometimes I want neither. So I need an easy way to do that.

Here’s the Snippet:

	<div${1: id="${2:name}"${3: class="${4:none}"}}>
		${0:$TM_SELECTED_TEXT} </div>

The ${x: some text} identifiers are tab stops in the Snippet. After it inserts the snippet, everything within the bracket will be highlighted and you can type replacement text. When you’ve finished, you hit tab to move to the next one in the sequence. $0 is where the cursor will end up when you’re done. What this Snippet does insert a div (opening and closing tag) with an id=”name” and class=”none”, and initially highlight the entire id and class part of the tag. You can press delete and tab out to just insert a div, or hit tab and enter an id. Pressing tab again will highlight the entire class=”none” section and again, you can delete it and tab out. Or you can tab again and enter a class. Tabbing once again will place your cursor inside the div for further editing. It’s just a slight modification of the default div Snippet, but I find it very handy, and I hope it gives you an idea how to modify the included Snippets to your own liking.

Right now I’m going to leave you with a custom command that’s probably more fun than useful, but maybe both…

Wikipedia, automated

The HTML bundle comes with a command to automatically search Google and insert a link to the first result that comes up (”lucky linking“). It’s really cool. I modified it to add a title attribute based on the title tag in the head section of the returned page. Then I wanted to do the same thing for Wikipedia, but it wouldn’t work. Wikipedia required a User-Agent string. So I had to seriously modify the code. And then there was a far better chance on Wikipedia that a page wouldn’t be found, so I needed some error checking. Here’s the resulting code:

#!/usr/bin/env ruby
require "#{ENV['TM_SUPPORT_PATH']}/lib/progress.rb"
require "#{ENV['TM_SUPPORT_PATH']}/lib/exit_codes.rb"
require 'open-uri'
phrase = STDIN.read
TextMate.call_with_progress(:title => "Contacting Wikipedia", :message => "Looking for definition of #{phrase}") do
	response = open("http://en.wikipedia.org/wiki/Special:Search?search=#{phrase}",
	    "User-Agent" => "Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.1) Gecko/20060111 Firefox/1.5.0.1",
	    "Referer" => "http://www.ruby-lang.org/") {|f| $response = f }
	url = $response.base_uri
	# borrowed from iamrice.org
	fp = open(url)
	title = fp.read.match(/<title>([^<>]*)</title>/i).to_a[1]
	if title.include? "Search"
	   TextMate.exit_show_tool_tip "No definition found"
	else
	   print %{<a href="#{url}" title="Wikipedia Entry: #{phrase}">#{phrase}</a>}
	end end

I’ll just share it for now, and explain it more in detail at a later date. If you add it into a Command, put a key combo trigger on it, and have a current installation of Ruby and the TextMate bundles, it should work for you. Just highlight a word, hit the key combo, and sit back (just for a second). Leave me some comments if you find bugs, or if you just love it to death. If anyone wants to do the honors of converting it to Markdown, please, feel free.

By the way, the regex code in there can improve on the code that’s currently out there for getting the title of a URL. It accounts for newlines, spaces and all caps tags, but you need to run title = title.strip after it to clear out the extras it picks up.