Tutorial: Getting FlickRSS working with Lightbox 2 in Wordpress

Recently I was asked about getting a Flickr RSS feed to be put onto a website for which there is a wonderful Plugin for Wordpress already written by Dave Kellam. I was then asked if it was possible to have these images which were dragged from Flickr used in a LightBox. Fortunately there is already an excellent plugin called Lightbox2 which we’re able to utilise. With a few very simple modifications to the FlickRSS code, we got what we wanted! (You can see an example of this in the Footer of all of our pages under “…elsewhere”. Here’s a tutorial on how to achieve just that.

• First, download and install the 2 plugins [FlickrRSS and Lightbox2]
• In the flickrrss.php file which you’ll find in your Wordpress Plugins directory (/wp-content/plugins/flickrrss/flickrrss.php for example) you need to find the line [no. 110 for us] which reads:

  print $before_image . "<a title="\&quot;$title\&quot;" href="\"><img src="\" alt="\&quot;$title\&quot;" /></a>" . $after_image;

• You need to modify this line so that LightBox2 knows that it is a link which it should handle. You do this by adding a rel=”lightbox” so that line should now read:

  print $before_image . "<a title="\&quot;$title\&quot;" rel="\&quot;lightbox\&quot;" href="\"><img src="\" alt="\&quot;$title\&quot;" /></a>" . $after_image;

• As it stands, (if you were to set $img_url = $imgurl) when you clicked on an image from your feed your lightbox would pop up but the same image would be displayed. This isn’t ideal as we want a larger version of the thumbnail to get put into the LightBox, so we need to alter the image url
• Directly above the line of code we have just altered, create a new line which has the following:

  $img_url = str_replace("_s.jpg", ".jpg", $imgurl);

  $url = str_replace(”_m.jpg”, “.jpg”, $imgUrlMatches[1]);

• This now gives the Lightbox the bigger “medium-sized” image link from Flickr instead of the thumbnail

And that’s us done! Save all of that and you should have a working Flickr RSS feed with Lightbox2 integration. Thank you to the writers of both the Plugins used and of course the wonderful people who create Wordpress and keep it at the best possible price…nadda!

Update: Lynn, in comment 3, has informed me that the original code didn’t work with the new version 4.0 of FlickRSS.  She also, rather nicely, has figured out how to edit the code to make it work!  Bravo!  The code above should now work with the new version of FlickrRSS 4.0!