EE Photo Contest
May 18, 2007
If you read the article on Debra’s Dynamic Gallery, you might have noticed that I say at the end that after all the work it took to put the Flickr gallery together, my clients didn’t go for it. The one thing they heard, though, was my recommendation that they get out of the hosted-photo-sharing service because it wasn’t part of their mission.
The thing they were actually using the existing photo galleries for was to have a photo contest each month. They reward their users for participating in various activities, and uploading photos is one of them. So, the basic idea was to get rid of the whole gallery thing and just do the contest. They really liked the slide show aspect of what I did for the Flickr gallery. They asked “Can’t we just do a contest where our users just submit photos each month to some place on the site, we judge ‘em, and then show the winners in the slideshow thingy you made?”
Yep, they could. But it turned out a little more complicated then it seemed at first blush, as usual.
Requirements
1. Uploading the photos has to be as simple as possible.
2. The photo contest runs from the first day to the last day of the month.
3. The photos for the current month have to be identified and also hidden in the archive.
4. The home page shows the winners from last month.
5. There has to be some easy, quick way to see all the entries for the month and judge them.
I wish I could just point you to the site where it’s in use. Unfortunately for you, the contest I created is part of a members-only site. So I made a fake one that functions pretty much like the real one, less a few bells and whistles.
Go see last month’s fake winners.
I use Expression Engine (EE) as my content management tool. This article presents a fairly in-depth discussion of how I created this application using EE. I’m going to be using EE-based code snippets and terms throughout. If you use a different CMS, you can use this tutorial to understand the basic concepts and then roll your own.
Task List
Uploading Photos
I thought the dead-easiest way for users to upload photos for the contest was via email. Even fairly non-savvy folks can figure out how to attach a picture in an email, right? Expression Engine (EE), my content management tool, makes this easy with their Moblog module. (note: the Moblog module is available in either the personal or commercial versions of EE. It’s not available in the free Core version.) I set up a separate email address for the contest entries, and created a weblog that the moblog would post the entries to.
First, we need a weblog. I called mine “contest.” We don’t need any custom fields. We do need a custom status, though. So go create a new status group for this new weblog, and assign it. You need to add just one custom status, called “thismonth”.
Moblog Template
Basically, the title of the entry is whatever is in the Subject field of the email. In our case, we instruct users to put their name in the subject.We tell them to put their caption in the body, and to delete any auto-signatures.
The Moblog template puts the caption in the summary field of the weblog. We also include the sender’s email address in there. The standard image source code gets put in the body, and just the file name in the extended field. Note that I’m setting the format of these fields to none. This is important, as we don’t want any XHTML tags (like <p> or <br /> ) in these fields!
Identifying Photo Entries for the Current Month
Moblog Preferences
Our contest runs monthly. So we need a way to distinguish entries that are for the current month. We use a custom status for that in the weblog, called “thismonth”. You can specify that in the moblog preferences. Finally, I created a directory just for the contest images, and specified that as well.
That’s all the info we need to collect entries for the contest, and it’s super simple for the contestants!