Home » Company » Blog » Community » Zen Coding

Zen Coding: The ultimate time-saver...

Andy Boyd, IDM
Marketing Manager

Recently, I was introduced to the concept of Zen Coding. I don't do a whole lot of HTML coding, but I have to admit this is a great idea! What is Zen Coding?

For HTML coders, this could be the ultimate time-saver...

Zen coding is a high-speed method of coding HTML/CSS (learn more here). It allows you to generate HTML tags using css style selectors.

So, with Zen Coding, you can quickly go from this:

div#content>h1+p

to this:

<div id="content">
<h1></h1>
<p></p>
</div>

One of our forum members developed a script to use the Zen Coding methodolgy in UltraEdit, so we want to share this with the UE community. How do you use it? Keep reading...

Step 1: Download the script

First, download and save the Zen Coding script from:

http://code.google.com/

or from our scripts:

http://www.ultraedit.com/files/scripts/ZenHTMLUltraEdit.js

Step 2: Install the script

Go to Scripting : Scripts, then add the ZenHTMLUltraEdit.js script to your Scripts list.

Zen Coding

Step 3: Type your shorthand code

Type your shorthand using your CSS like selectors. The example used in the article is: div#content>h1+p:

Zen Coding

Now, select the code, and run the script; here is the result:

Zen Coding

For added convenience, you can assign a hotkey to the ZenHTMLUltraEdit.js script. Go to Scripting : Scripts, double-click in the Hotkey field, and create a hotkey.

Zen Coding

Update (March 29, 2011)

One of our users has written a Zen Coding script for PHP in UltraEdit/UEStudio. You can get that script at GitHub or from our site here.

Got a tip or trick you want to share? Let us know!


Share this:  

Submit to Twitter Submit to Facebook Submit to Technorati Submit to Delicious Submit to Digg Submit to Mixx Submit to Reddit Submit to Stumbleupon Submit to LinkedIn

Back to Top

Comment on this post

Required fields are marked with *.


Back to Top

Subscribe to our blog

Get software updates, company news, staff editorials, and power tips in your RSS reader.

IDM Highlights newsletter

Sign up now for...

  • Software Powertips
  • New Releases
  • Update Notices
  • Cool Tools, Specials
  • Company News