Portfolio pages as a photoblog

I’ve started moving the content from the former “HTML Dreamweaver templated”:http://www.momathome.com/portfolio-old/ portfolio pages to the “new, entirely in MovableType layout.”:http://www.momathome.com/portfolio

However, I’ve done more than just move content, I’ve implemented some plug-ins and features that you might find interesting (if you’re into CSS tricks & MovableType, that is).

First, the structure. I studied Photoblog techniques around the web and decided on a plan of attack that I think will work out well. I’m documenting it here in case anyone is Googling and wants yet another mix for the pile.

I created a separate blog for the portfolio and broke it into 3 categories: Identity, Web & Print.

I used the “OtherBlog”:http://www.rayners.org/2003/01/06/mtotherblog_v_025.php plug-in to list the latest content from that blog on the sidebar of the main page of “A View From Home.”:http://www.momathome.com/viewfromhome and visa versa. I suppose I could have also used PHP, but this works.

The entries on the “main page”:http://www.momathome.com/portfolio of the portfolio only contain the excerpt field, including a 90×120 thumbnail. The detail page (see “this page”:http://www.momathome.com/portfolio/print/living_with_colon_cancer_booklet.php for example) has a larger image and maybe more text in the main content field. I’m not saying as much about some of these older projects. I’m trying to put the older ones up first so the main indexes will show the new stuff.

The drop shadow technique is entirely CSS and is “borrowed” from a wonderful article at “A List Apart.”:http://alistapart.com/articles/cssdropshadows/ A simple div and 2 style rules is all there is to it.

By mapping the fields carefully, I was able to take advantage of David Raynes “Related Entries by Keyword”:http://www.rayners.org/2002/12/17/mtrelatedentries_bykeyword.php plug-in to show other work for the same client. I simply typed the client name in the keyword field. I used Brad Choate’s “MTIfEmpty”:http://bradchoate.com/weblog/2002/07/08/mtifempty plug-in to help evaluate whether or not there would be any entries qualifying for the related entry area. If so, the excerpts (with thumbnails) are shown, if not the area is empty.

So the photoblog/portfolio is just:
Title = Title
Summary = Thumbnail & short description
Main entry area = Larger picture(s) and more text
Keyword = Client name (careful with consistency)

The portfolio “category”:http://www.momathome.com/portfolio/identity template is done, too.

Now I just have to get the rest of the content transferred to the database using ecto. And make the comment preview, search template and custom 404 pages. Not bad for a weekend’s work. I also want to figure out how to get rid of the comment section completely if comments have been closed and there were no comments (see “this page”:http://www.momathome.com/viewfromhome/life/another_day_off_from_school.php for an example of what I’m talking about) I know it can be done, I just haven’t gotten the template to behave yet.

Oh, and the .htaccess redirect is in place so if you ask for an old archive page it will automatically take you to the new page.

Advertisements