CityDesk In DepthIn this article, Fog Creek Software founder Joel Spolsky looks under the hood at what CityDesk does and how it works. This article is intended for experienced web developers and programmers. First things first The first thing you see when you start up CityDesk is a window showing the hierarchical view of your site.
It looks like a bunch of folders, with articles, HTML files, and pictures in there -- and indeed, that's what it is. But it's all stored in a single file on your hard drive using Microsoft Jet, that is, the exact same format as Microsoft Access. If you have Access on your system you can open up a CityDesk file and peek under the hood. The simplest way to use CityDesk is just to drag your existing site, with all its folders and documents, into the window. You can rearrange them, edit the HTML files in a WYSIWYG editor, or edit any file using any editor you have installed. Here's what the built-in editor for HTML files looks like.
It's totally WYSIWYG and very easy to use for people who are used to word processors. There's a spell checker, drag and drop, a word count, etc. Inserting a picture is as simple as dragging it in place. One click publishes your site. It copies over files using FTP or plain old file copy to any server you specify. After a file has been copied once, it normally won't be copied again unless it changes. (You can override this optimization and republish everything by checking a box). Indeed, if you wanted, you could use CityDesk as an overpriced file transfer utility. But bear with me for one more simple but important concept which makes CityDesk a zillion times more powerful. A simple concept If you have a web site with more than about three pages, chances are most of those pages are going to look substantially the same. Think of a popular news site like CNN. Click on just about any story, and you get a page which is 90% the same as every other news story. They might all have the same stuff at the top and bottom, and the same fonts and colors. The only thing that changes is the actual words in the middle. At the heart of CityDesk is a very simple concept: the template. Instead of creating thousands of pages with the same formatting and slightly different content, you create one template which has a hole in the middle where you can stick different content to create each page. What do CityDesk templates look like? Nothing unusual. They're just HTML pages that contain placeholders instead of the actual text. Here's a dirt simple template:
As you can see the placeholders are set off by surrounding them with {$ and $}. So now imagine that you had a simple database that looked like this:
By slamming each row of this database into the template, we could generate three complete, beautifully formatted web pages. (Well, if the template was ugly, the pages would be too, but you know what I mean!) This is what it looks like to edit a template in CityDesk:  Although CityDesk has a simple WYSIWYG editor, to get your templates exactly right many designers will edit them in HTML View:
In fact we expect that template designers have their own favorite HTML editors and we make it easy to use them:  Automatic table of contents The first thing every site needs is a table of contents -- something that lists the articles available with links to them. In CityDesk you can create a table of contents anywhere you want by writing a little bit of simple CityScript code. Here's an example:
There's a little loop here surrounded by foreach and next. What this means in English is "for every article which is in the folder named news, print the headline, and make it a link to the article itself." If the folder "news" contained three articles, this would produce a table of contents like this:
Whenever you delete, rename, move, or add an article, the table of contents will be updated automatically. You can change the formatting of the table of contents just by changing the HTML. One popular feature is to include a teaser next to the name of the article. There's a place to enter this in the article editor. Then your table of contents might look like this:
You can have as many tables of contents as you want, throughout your site. By modifying the conditions on the foreach loop, you can do really interesting things, for example:
If you want to have a table of contents that lists "the first 10 articles in the opinions folder written by John Q. Editor from the year 2002, in alphabetical order and excluding any content which is only for advanced users", it's possible. Would you like that baked or fried? The power of templates depends on when you cook the content into them. Most HTML editing apps like FrontPage have templates, but once you put content into them, you're stuck. It's baked in. If you want to change the template on hundreds of different pages, you have to edit hundreds of different pages. High powered content management systems usually fry the templates to order every time a user requests a page. The page content and the template are not combined until somebody requests that exact page. The trouble with this approach is that it can't be done unless you install software on the web server, something that few webmasters can do. Most of us just have a web site somewhere with FTP access. So CityDesk takes an intermediate approach. We keep the content in a database, separate from the templates, until you press the Publish button in CityDesk. At that point CityDesk slams the content into the templates and uploads any changed files to your web server. Nothing on the server The reason CityDesk is so useful to so many people is that you don't have anything special on the web server. CityDesk just uses FTP to copy the files up to a directory you choose. When you're done your web site will look and work exactly like a web site where you laboriously hand-coded all the pages. Even before you publish, CityDesk has a Preview feature which lets you see exactly what the web site is going to look like before you inflict it on the world at large. If your web server doesn't support FTP, CityDesk will, on demand, create a complete copy of the entire site on your hard drive (or on any network-connected hard drive). Then you can use another mechanism (cvs, scp, rdist, sneaker-net or carrier-pigeon) to actually get the files up onto the server. When CityDesk copies your site to the server, it also publishes an XML file with a list of files and their checksums (What's a checksum?). The next time you try to publish, CityDesk can quickly figure out exactly which files have changed. So if you only changed a tiny thing in one file, only that file has to be copied to the web server. Making it easy The philosophy of CityDesk is that it should be super easy for complete novices to update their web sites using CityDesk. Advanced stuff Since everything in CityDesk lives in a database, there are all kinds of advanced content-management type things you can do. Here's a quick list of features.
Try it, it's free! The starter edition, which lets you make web sites that contain up to 50 files, is absolutely free. Download it now! The Professional Edition is priced reasonably and comes with the Fog Creek Software no-questions-asked 90 day money back guarantee. You can buy them now and download them right away at the Fog Creek Store. CityDesk is a trademark of Fog Creek Software, Inc. Windows, FrontPage, Jet, and Access are trademarks of Microsoft Corp. All other trademarks belong to their respective holders. |
Once you turn off CityDesk's designer mode, there are only four buttons on the toolbar. Even the most computer-phobic writer, who might be overwhelmed by a full-featured web design program, can be taught how to add, edit, and remove articles. Editing articles is as easy as using a GUI word processor. Adding pictures is a simple matter of drag and drop.