Textmate “page” snippet

Monday, February 26th, 2007

For any avid Textmate (or E) user, you might (or might not) find this little snippet useful when prototyping out a quick page and all you need is the barebone requirements of simple html page. It can be edited to suit your needs. Simply add this as an HTML snippet, and assign the tab trigger “page” (or whatever else you want to call it). Here it is:

HTML page template snippet

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en">
    <head>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
        <title>${1:Title}</title>
        <style type="text/css" media="screen">
        <!--
        body { background:#111;color:#fff;font:12px tahoma,'trebuchet ms', sans-serif; }
        h1 { font:300% georgia,times,serif; }
        -->
        </style>

        ${2:${3:<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.2.0/build/reset-fonts-grids/reset-fonts-grids.css" />}
        ${4:<script src="http://yui.yahooapis.com/2.2.0/build/utilities/utilities.js"></script>}

        ${5:<script src="http://yui.yahooapis.com/2.2.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>}}
        <script type="text/javascript">
        <!--
        $0
        //-->
        </script>
    </head>
    <body id="${6:page}">
        <div id="doc">
            <h1>$1</h1>
        </div>
    </body>
</html>

Keep in mind, this was tailor made for mwah (that’s me). So by all means, tailor it to your own needs. Cheers.

15 Responses to “Textmate “page” snippet”

justin
February 27th, 2007 at 12:11 am

Why not…
http://www.w3.org/TR/xhtml1/#h-4.8
justin
February 27th, 2007 at 12:24 am

To get back on topic, why do you prefer this method of creating a new blank page over the built-in “New from Template”?
Dustin Diaz
February 27th, 2007 at 12:43 am

justin, what does it matter which doctype you use. Just use one (or don’t). I think you’ve missed the point. The key benefit is also that you just use it as a tab trigger.
Remy Sharp
February 27th, 2007 at 1:15 am

Not to be too picky, but since you’ve declared your DocType as strict, you should really add the ‘type=”text/javascript”‘ attribute in the
```
<script src ...
```
tag to make the page validate.

Cheers for the snippet.
Dustin Diaz
February 27th, 2007 at 1:29 am

Or maybe I should change the doctype to HTML 4.01. That would probably be better fit for me.
Jesper Haug Karsrud
February 27th, 2007 at 1:51 am

Nice snippet, Dustin. I created a snippet almost like this one for Intype, and I really find it useful when I need to do something really fast. :)
justin
February 27th, 2007 at 9:30 am

Take it easy Dustin, you’ve got expect stuff like that when you’re a well-known blogger in the XHTML/CSS/Web Standards community.

I’m sure you have your reasons, just wondering what they are (just like Remy Sharp in another comment).

Will Green

February 27th, 2007 at 11:18 am

Your Javascript includes are redundant (yahoo-dom-event is already inlucded in utilities). From the README for utilities in the latest YUI release:

The utilities.js file rolls up all of the YUI utility components into a single
file; it includes the following components:

* Yahoo Global Object
* Event
* Dom
* Connection Manager
* Animation
* Drag & Drop

For implementations that use a significant subset of these files, it may prove
more efficient to include utilities.js as opposed to including separate files
for each component.

Note: If you are require only the Yahoo Global Object, Event Utility and Dom
collection, consider using the special yahoo-event-dom.js aggregate instead.

Dustin Diaz
February 27th, 2007 at 11:20 am

@Will: I definitely of most people know that. It was purposely done for the sake of choosing which ones I want. If you look at the snippet itself, it tabs over each and hilights the block. I generally end up using one or the other. But never both.
Jason Beaird
February 27th, 2007 at 12:27 pm

I’ve been working on a PC lately and E doesn’t have all the features of TextMate, so this may come in handy for me now that I don’t have “New from Template” available.
Paul Armstrong
March 2nd, 2007 at 9:37 am
```
font:300% georgia,times,serif;
```
Are you going blind there?
Matt K.
March 3rd, 2007 at 7:23 am

I’ve been using E for a while and it’s pretty cool. It’s not a ‘Textmate replacer’ by any means but it’s the closest thing on a PC for right now.
Rob Ellis
March 8th, 2007 at 10:33 pm

E is pretty good, but ‘the closest thing on a PC’ - Check out Intype (intype.info)

Rob
Dustin Diaz
March 8th, 2007 at 11:05 pm

Hi Rob,
I have to disagree since I tried out Intype first before even discovering E. E is well ahead of where Intype stands.
Rob Ellis
March 9th, 2007 at 12:27 pm

While I don’t want to go too far off topic, I do agree that E is ahead of Intype and I think there is room in this space for more then one player. This thread sums up some of the differences -
http://intype.info/forums/discussion/329/intype-vs-e-text-editor

Rob

./with Imagination