EYEHEARTZOMBIES

Textpattern plus Photostack

July 29

First things first. You need to head over to photostack.org and download the latest version of Photostack. The version I worked with is 2.0b13, if you get a later version, these steps might not work.

Install the software as instructed, then get out your favorite shell, ftp program, or ftp-enabled text editor, and open up the index.php file in the photostack directory. Add in the usual textile-enabling code to the beginning of the document so it looks like:

</code> Obviously you need to replace <strong>/full/domainpath/to/</strong> with your domain path to Textpattern. The above bit was found on the "Textpattern forums (forums for textpattern)":http://forums.textpattern.com, "posted (the forum post)":http://forum.textpattern.com/viewtopic.php?id=1928 by "Jon Hicks (lovely designer from the UK)":http://www.hicksdesign.co.uk/. The rest is pretty straightforward, but there were a few pieces that I didn't get at first. Open up *textismIndex.tmpl.php*. This is the template used to show an index of all your albums. What I recommend doing is merging this and your Textpattern template. There are key elements in the Photostack template that make the page a bit more useful, so you shouldn't delete them. And, of course, using Textpattern forms makes building your page a lot easier. "Here's (link to the template file)":http://www.eyeheartzombies.com/photostack/textismIndex.source what my *textismIndex.tmpl.php* source looks like. Lines 1 &ndash; 11 are basic Textpattern stuff. Line 12, instead of using <code> (which wouldn’t generate anything, as this page has no relation to the Textpattern database), I’ve supplied “eyeheartzombies” as the title. You can use associated Photostack elements here, if you wish.

Lines 13 – 23 are from the default Photostack template. They supply useful meta data including copyright information and page relations. You can omit them with no problems, I’m sure. Notice how lines 16 – 18 are wrapped in </code> tags. These tags make the contained information only available when Photostack is parsing albums, as opposed to individual photos. Skipping down to line 43, we start the real Photostack work. The <code> opening tag again sets that conditional. If it is dealing with albums (as it has to be, at this point), it starts an unordered list with a class of “listing”, gives it one item, and a paragraph.

The next tag is a sibling of the </code> tag. The <code> tag sets a conditional that the following is only applicable to photos, not to albums. The num=”1″ attribute only lets it pull one photo from the album.

It creates a link with the url (?album=), title (</code>) and a class. Then an image from the album is pulled up as a thumbnail (Photostack autogenerates the thumbnail when the album is uploaded) and lists the name of the album. By default, the date of the album is also included. I omitted this, but feel free to leave it. Finally, we close the <code> loop, the paragraph, the list item (there will be one for album, of course. The </code> tags work like loops _and_ containers), the list and finally, the <code> loop.

The rest is just HTML and Textpattern code.

I’m not going to explain how to do the other files; I’m sure you can manage them if you’ve managed this one. Of course, feel free to ask for any more help.

Leave a comment