Taking advantage of Flickr for hosting blog photos22 Jul 2007
Found in: Expression Engine, Web Design
Posted at: 7:07 PM
I’ve been looking for a way to both automate the image uploading/resizing process and to outsource bandwidth for the blogs on The Periodic Label, and I figured out a way to do it using Flickr. Right now we have 3 separate blogs with 3 separate authors on the site, and plan to have more as we continue to grow. I’ve been hesitant to use the built-in file uploader and let all the authors upload their own photos for their posts for a couple reasons—I couldn’t be sure they’d always remember to resize the images for the Web; and if we do end up with many more authors and blogs, storing and serving the photos could eat up a huge chunk of our resources.
I don’t take a whole lot of photos so I’ve never really used Flickr, but I decided to have a look around and see if there was a way to make it work. A Google search for “adding a Flickr photostream to a blog” led me to the Flickr badge, and this great tutorial on getting it to validate. The problem was that it would just add the most recent photos, a random selection or photos with a specific tag. I had to find a way to synch up photos for a specific entry with photos stored on Flickr. For that, I took advantage of the tagging system.
The first problem was getting the right photos for the right entry, and I realized that could be handled by tagging the photos with the entry date of the post. For instance, this is the script that Flickr uses to grab photos with a specific tag:
<script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=10&display=latest&size=m&layout=x&source=user_tag&user=10286167%40N02&tag=071607">
You can see that the tag that it’s grabbing is “071607”, or July 16, 2007. All I had to do was change the script to:
… &tag={entry_date format=’%m%d%y’}">
and it would grab only the photos tagged with the entry date of the post in the correct format.
The second problem was making sure the script was pulling the right photos for the right blog. As it’s written above, if 2 authors posted on the same day, we’d be screwed. To solve that problem, I took advantage of the conditional variables in EE. The way I set the blogs up, the fourth segment of the URL names the specific blog. I added an if statement at the top of the template (curly brackets around “if” and “/if” omitted):
if segment_4 == “earl_blog"{assign_variable:flickr_id="earl"}/if
and then added the variable to the script:
… &tag={flickr_id}_{entry_date format=’%m%d%y’}">
So now all the author has to do is tag the uploaded photos with the first four letters of his/her band and the entry date, i.e. for Earl Greyhound’s blog “earl_071607”. See the results.
The only drawback to this (that I’ve thought of...can anyone think of anything else?) is that I have to give all the authors access to The Periodic Label’s Flickr account. Not a huge deal, since it’s only used to host the blog photos, and there’s no sensitive account information in a free Flickr account.
Comments
Motorcycle Fairings | 20 Nov 2008 | 11:22 AM
Excellent explanation. I was wondering how some people dragged some pictures to their posts without including the real picture in the content. Thanks a lot.
Add your comments