• View
• Edit
• History
• Attach
• Print
• Backlinks

FlickrAlbum

Questions answered by this recipe

• Can I display Flickr images dynamically in my pages?

Description

Using this recipe will allow you to have albums of Flickr photos in your wiki that update automatically when new photos are added to Flickr. This recipe requires the use of the phpFlickr class written by Dan Coulter, a Flickr API key, and this recipe. You may also need to use MySQL (see below). Follow these steps to Flickr photos in your site:

1. You will need a Flickr API key. You can apply for one here:
   • http://www.flickr.com/services/api/
2. Download and unpack into /cookbook/phpFlickr the latest version of phpFlickr from:
   • https://sourceforge.net/project/showfiles.php?group_id=139987
3. Download flickr-album.phpΔ and place it in your cookbook folder.
   • You'll need to add a line or two to config.php to configure the cache. This is where MySQL comes in. There are two options, filesystem cache and database cache; but currently the filesystem cache is problematic and hopefully will be fixed in a later version.
4. Enable flickr-album in your config.php with the following:
   • $FlickrAPIKey = "insert_your_API_key_here";
   • $FlickrDB = "mysql://user:password@localhost/dbname";
   • include_once("$FarmD/cookbook/flickr-album.php");

The script will display an album of photos by a given username. The album is contained in a div called "flickralbum" which can then be styled using skin or local css.

The simplest album can be created by using the markup (:flickralbum:) which will create an album of 12 of the most recent photos added to Flickr in 6 columns. (:flickralbum user=foo:) can, then, be used to create a similar album of recent photos by someone with the Flickr username foo, etc.

The following is a list of arguments possible for other combinations:

• user=? - flickr userid
• tags=? - tags to limit by, comma-delimited
• columns=? - number of columns in album
• number=? - total number of photos to show
• type=recent - show most recent first
• type=interesting - show most interesting photo first
• size=? (Square, Thumbnail, Medium, Original - note: not all photos come in every size)
• lightbox=1 (for lightbox, see below)

As of version 0.5, you can also specify that the images returned be displayed using Lightbox, using "lightbox=1". In order to do this, you have to install Lightbox JS on your server in a web-accessible location, then add the following to config.php:

  # lightbox
  $HTMLHeaderFmt['lightbox'] = "
    <script type='text/javascript' src='http://your.url/lightbox/js/prototype.js'></script>
    <script type='text/javascript' src='http://your.url/lightbox/js/scriptaculous.js?load=effects'></script>
    <script type='text/javascript' src='http://your.url/lightbox/js/lightbox.js'></script>";

For examples, see my test site.

Notes

Many other uses of phpFlickr are available and future tweaks of this recipe are planned, particularly for displaying photos in sets and groups.

• This recipe was last tested on PmWiki version: 2.2.0.beta19
• This recipe requires at least PmWiki version: 2

Updates

2007-05-03: Added global variables for database/filesystem caches, changed styling for images (now you should use .flickralbum in your CSS instead of #flickralbum).
2007-01-03: Worked on groups, added lightbox, fixed username error
2006-03-16: Made non-user-specific albums possible
2006-02-06: Added global variable for API key
2006-01-30: Initial release

Comments

• How should I adjust program so that I don't have to specify a user, or be able to use a wildcard? Johanna. 14 Mar 2006.

• Is there any syntax for dealing with a space in a Flickr screen name? My screen name is normally Geoffrey Wright. If I use the following syntax I get the wrong photos: (:flickralbum user=Geoffrey Wright:). This doesn't work either: (:flickralbum user="Geoffrey Wright":). If I change my screen name anything without a space it works great. Is there a correct way to handle a space in a screen name? April 18, 2006. --GeoffreyWright?

• Is there a possibilty to display just images which belong to a certain set? and to be complete display images which belong to a group would be nice to have also.. elektromeier. 2 May 2006.

    case 3:    // Set
      $photos = $f->photosets_getPhotos($opt['set'], NULL, NULL, $opt['number']);

      if (is_array($photos['photo'])) {
        // Build the album
        foreach ($photos['photo'] as $photo) {
	        // Have to fix url for each photo if no username
	        if ($opt['user'] == '') $photos_url = "http://www.flickr.com/photos/".$photo['owner']."/";
	        // Build image and link tags for each photo
	        $output .= "<a href='";
	        if ($opt['lightbox'] == 1) $output .= $f->buildPhotoURL($photo, $opt['size2'])."' rel='lightbox[flickr]' title='<a href="$photos_url$photo[id]">$photo[title]</a>'";
	        else $output .= "$photos_url$photo[id]'";
	        $output .= "><img alt='$photo[title]' "."src='".$f->buildPhotoURL($photo, $opt['size'])."'>";
	        $output .= "</a>";
	        $i++;
	          // If it reaches the end photo for $opt['columns'], insert a line break
	          if ($i % $opt['columns'] == 0) $output .= "<br />";
         }   // End of user search
	   }// End of if
       break;     

• It would be nice when a clicked thumbnail does not open in flickr but in pmwiki! elektromeier. 2 May 2006.

• How about showing photos from groups? yellowtailshark. 23 May 2006.

• To prevent errors if no photos are found wrap the foreach loop in the following statement: if (is_array($photos['photo'])) { // foreach loop (line 119) goes here }. This prevents it from throwing errors which won't mess up your wiki layout :) Breyten
• Can you explain this loop-edit a little better? I can get images without specifying a user fine, but as soon as I add the user=x tag, I get these errors:

-straitastudents

• Having the same issue on line 119 when adding the user= tag JanBrejcha

• Works great! Thanks for the fix! -straitastudents
• I am not getting the nice frame around each photo that is shown on your example site. In my case all the photos are right next to each other with no space. I haven't figured out why... Any ideas? DanBrehmer

    .flickralbum { margin:25px; }
    .flickralbum img {
      padding:5px;
      margin:5px;
      border:1px solid #afafaf;
    }

• This is a great recipe! I have searched for a photo/gallery recipe for PMWiki for awhile and, because of PMWiki's upload limitations, I believe this is the best I've found.
  However, I do have a request. Would it be possible to automatically include the Flickr photo description under each picture? Along with LightBox, that would make this an awesome recipe! August 6, 2007
  Thank you, Gamma
• Great Recipie. But it doesn't seem to refresh with new images as they are uploaded to Flickr. this is my code "(:flickralbum tags=architecture,architect,buildings columns=5 number=100 type=recent lightbox=1:)"

It would be great to be able to search by group and also to add a randomiser in there...Thanks Nick

See Also

Cookbook:PictureGallery

Cookbook:EmbeddedGallery

Cookbook:SimpleGallery

Cookbook:SimpleImageFloat

Contributors

• JonHaupt