Blog

Flickrpress: WordPress Flickr widget

Flickrpress screenshotFlickrpress is a widget/shortcode function to display items from Flickr in the sidebar or within pages and posts. This widget supports:

  • Flickr RSS feeds
  • Photostream
  • Filtering by tag
  • One or more photosets
  • Favorites
  • Displaying random items

Other features:

  • Choose from three different thumbnail types
  • Lightbox/Thickbox are supported
  • Data is cached locally to lower server load
  • Secure Flickr API used, to eliminate the risk of damage to your server, unlike some other Flickr widgets
  • Flickrpress is a multi-widget, so you can use more than one instance (e.g., one in your sidebar, one in your footer)
  • Use as a shortcode to insert into posts and pages — multiple instances supported in the one entry

Flickrpress uses the excellent phpFlickr library.


My latest project:

The Cartographer banner


Download

Download Flickrpress at the WordPress site.

If you like Flickrpress, please consider buying one of my products.

Installation

  1. Unzip the package, and upload flickrpress to the /wp-content/plugins/ directory
  2. Activate the plugin through the ‘Plugins’ menu in WordPress
  3. Add the ‘Flickr Widget’ to your sidebar and configure, or see the ‘Shortcodes’ section for information on use in pages and posts

If you wish to use content from anything but an RSS feed, you will need a Flickr API key. This can be obtained from Flickr

If you wish to use Lightbox, you must first install the Lightbox plugin.

Shortcode

Shortcodes are snippets of text that can be inserted into pages and posts. These snippets are replaced by various generated content. Flickrpress provides a ‘flickrpress’ shortcode to display images from Flickr within a page/post.

Available parameters:

type One of: ‘rss’, ‘photostream’, ‘sets’, ‘favorites’
url URL for RSS feed
api_key API Key for types other than RSS
account Account name, email or ID
sets Comma-separated list of photoset titles
tags Comma-separated list of tags to filter by (for photostream view)
view One of: ‘squares’ (view as squares), ‘proportional’ (proportional thumbnails) , ‘large’ (large thumbnails)
count Number of thumbnails to display
paging ‘true’ to show page navigation, to move back and forward through pages of images (implemented using AJAX)
random ‘true’ to display randomly
lightbox ‘true’ to use Lightbox
columns Number of columns of images to display

Example:

  [flickrpress type="photostream" api_key="xxxxxxxxxxxxxxxxxxxxxx" account="michaeltyson" count="30" paging="true" lightbox="true"]

Styling

Flickrpress comes with CSS styling, but if you wish to modify its appearance, such as adding frame borders, simply style the “flickrpress-container” class. See style.css for more.

FAQ

I’m seeing “Flickr is currently unavailable” messages

You may have an incorrect setting: To see the actual error message, open your server’s error log and look for Flickrpress messages. How you do that depends on your host – on mine, Site5, the error log appears in the WordPress folder; on others, you access it through a web interface). If you can’t get to it, open up the file includes/interface.php in the plugin’s folder, and change error_log on line 22 to echo – then any messages will be printed to the screen. You’ll want to change it back afterwards so your visitors don’t see those messages.

Changelog

1.0.2

  • Added Thickbox support
  • Compatibility fix for PHP 4

1.0.1

  • Bugfix in navigation javascript encountered when Lightbox isn’t installed

1.0

  • Implemented AJAX-based navigation through pages of images
  • Added shortcode documentation
  • Caching for shortcode and php calls
  • Removed ‘css’ option in favour of always including CSS
  • Fixed conflict between shortcode and widget versions
  • Fixed bug in loading all photostream items

0.3.2

  • Fixed a warning when using shortcode

0.3.1

  • Fixed a packaging snafu

0.3

  • Support for use outside of sidebar

0.2.1

  • Bugfix for displaying random favourites

0.2

  • Now able to be styled as described in http://www.webdesignerwall.com/tutorials/css-decorative-gallery/. See style.css for more info.

0.1.1

  • Bugfix for when only 1 random image shown

0.1

  • Initial release
, , . Bookmark the permalink. Both comments and trackbacks are currently closed.

51 Comments

  1. Posted September 3, 2010 at 11:33 am | Permalink

    Ow almost forgot this one;

    Around line 500 in flickr.php

    $columns = $options['columns'];

  2. Charles
    Posted September 18, 2010 at 11:44 pm | Permalink

    I like that you offer the option of using lightbox, but I need to use a different version of lightbox that is compatible with Vimeo videos.

    The version of lightbox that I’m using is prettyPhoto: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

    On my website, prettyPhoto and Flickrpress work great together with the first six Flickr photos, but when you hit “next” it stops working for every image after that. I’m assuming it’s because some script is still calling [rel=”lightbox”] instead of [rel=”prettyPhoto”] – but I’m not sure where to find that or how to correct it. I have modifed flickr.php to reflect [rel=”prettyPhoto”], but again, it only works with the first group of photos before you hit “next”.

    Your help would be greatly appreciated in this matter – I would be very grateful!

    • Posted September 19, 2010 at 1:27 am | Permalink

      Hello,

      You’ll need to find out how to force the lightbox replacement to refresh, when content changes dynamically. You’ll see in flickr.js:42-47 the code which updates lightbox and thickbox ( “myLightbox.updateImageList();” and “tb_init(‘a.thickbox’);”) – You’ll want to add whatever is necessary to cause the new plugin to update, too.

      Cheers, Michael

      • Charles
        Posted September 19, 2010 at 4:15 am | Permalink

        Wow – thanks for the quick reply!

        I’ve contacted the prettyPhoto support, but I’m not sure if they’ll respond or not. Looks like there are a lot of unanswered questions on their support forum. Someone asked the same question as me in May 2010 and no one has answered yet.

        I’m pretty noob at all this; would you be willing to look at the prettyPhoto js to see if you can find the function you mentioned?

        I’ve uploaded it to pastebin here: http://pastebin.com/vRPumpW5

        I really know nothing about programming, but I tried adding this to your flickr.js and it didn’t make a difference:

        prettyPhoto.initialize ();

        Maybe there’s something else I’m supposed to be looking for in that code?

        You can’t imagine how much I appreciate your help – good on you!

        • Posted September 19, 2010 at 4:26 pm | Permalink

          That appears to be the minified version, which is pretty much unreadable, I’m afraid. I think you might be stuck trying to get a hold of the developer! Good luck, though.

          • Charles
            Posted September 20, 2010 at 9:58 pm | Permalink

            Michael,

            I sincerely appreciate your reply. I was able to get ahold of the prettyPhoto developer and he just replied to my forum post, but I don’t think I’m as smart as you and am having trouble understanding his reply ;)

            Could you take a look and see if it makes sense and possibly chime in, if necessary, so he knows what we’re looking for? I would LOVE to get these two plugins working together because it would be quite a powerful combination.

            Here is the thread in reference: http://forums.no-margin-for-errors.com/discussion/757/force-prettyphoto-to-refresh-when-content-changes-dynamically/#Item_2

          • Posted September 20, 2010 at 10:18 pm | Permalink

            I’m afraid I’m right there with you in incomprehension, Charles – they’ve misunderstood your question and answered something completely different; Your clarification was good, though – they should get the gist this time.

  3. Posted September 19, 2010 at 8:28 am | Permalink

    Hey, Michael… Great plugin! I’ve just installed Lightbox 2, and I’m displaying stuff using Flickrgallery in a sidebar and on a gallery page… http://www.dextarfx.com/gallery/ I was wondering if you can point me to a page with Lightbox/Flickrpress customizing tips? I specifically want to change the spacing between the thumbnails, and add the Flickr description to the englarged images, but I’m just not sure what file to edit. any suggestions? Nick

  4. Charles
    Posted September 21, 2010 at 2:25 am | Permalink

    What would cause this plugin to not show everything that’s showing up in my Flickr RSS feed?

    Just uploaded some pictures today and they were immediately reflected in my photostream’s RSS feed, but for some reason, not all of the pictures are updating in this plugin. And of the pictures that ARE showing up, some of the captions aren’t up-to-date (I’ve been changing them). Is there some sort of lag even though the RSS is being updated immediately?

    • Posted September 21, 2010 at 3:18 pm | Permalink

      Hi Charles,

      There is some caching that happens – that might be delaying updates, but if you’re actually seeing some new entries showing up, and some not, then that’s got me baffled! Hmm…

      • Charles
        Posted September 21, 2010 at 4:01 pm | Permalink

        You were right – it was caching. The pictures and captions are fully updated this morning. I wasn’t aware that it was caching, so I’m glad I asked.

        Thanks!

  5. Håvard Gjelseth
    Posted September 24, 2010 at 1:47 pm | Permalink

    Hi, is there some way to make the title FLICKR (above the thumbs) becoming a link to the Flickr-page?

    • Posted September 24, 2010 at 3:51 pm | Permalink

      If you like, you could open up flickr.php, find the lines:

      if ( $options['title'] ) {
        echo $args['before_title'].htmlspecialchars($options['title']).$args['after_title'];
      }
      

      And replace them with:

      if ( $options['title'] ) {
        echo $args['before_title'].'<a href="http://flickr.com/photos/your-username/" rel="nofollow">'.htmlspecialchars($options['title']).'</a>'.$args['after_title'];
      }
      

  6. Charles
    Posted October 1, 2010 at 4:43 pm | Permalink

    Following up with my earlier lightbox issue – is the function in this comment what you’re looking for?

    http://forums.no-margin-for-errors.com/discussion/comment/1764/#Comment_1764

    I copied and pasted it here in flickr.js:

      if ( typeof(myLightbox) != 'undefined' && typeof(myLightbox.updateImageList) == 'function' ) {
         myLightbox.updateImageList();
      }
      if ( typeof(tb_init) == 'function' ) {
         tb_init('a.thickbox');
      }
    function reloadPrettyPhoto() {
    

    $(“.pp_pic_holder”).remove(); $(“.pp_overlay”).remove(); $(“.ppt”).remove(); // edit it with your initialization $(“.pretty-photo-gallery a[rel^=’prettyPhoto’]”).prettyPhoto({ theme: ‘facebook’, allowresize : false }); // } });

    }

    It still doesn’t seem to be working. Did I include it in flickr.js correctly?

    • Ted
      Posted March 24, 2011 at 7:14 am | Permalink

      Was there a final solution to this problem? The plugin still seems to be broken in this regard.

  7. titi
    Posted October 4, 2010 at 12:47 pm | Permalink

    Hey,

    Thanks for this plugin. I’m expecting a problem when I click on “Next” to see the next pages, it worked well the first time, but now nothing is happening. I only have the loading gif. And nothing more…

    So the link “next” doesn’t work anymore, any idea?

  8. titi
    Posted October 4, 2010 at 1:01 pm | Permalink

    forgot to mention i’m using RSS mode.

  9. titi
    Posted October 4, 2010 at 1:14 pm | Permalink

    Found it!

    I edited flickr.php with the online editor, and after that the page navigation didn’t work anymore. So I had to edit the file locally and then upload it.

    Weird?

  10. Posted October 8, 2010 at 7:43 pm | Permalink

    Hi, thanks for the widget! One question: I haev lightbox activated and it works, however, the image that is displayed is medium size. How can I change it so that the large version is being displayed?

    Thanks, C

  11. Posted October 26, 2010 at 8:25 am | Permalink

    Hi Michael!

    Is there a possibility to create a gallery with two tags – something like this: tags=”dog AND big”. So it would only show photos tagged with both “dog” and “big”. So no small dogs, just the big ones :)

    • Posted October 26, 2010 at 2:46 pm | Permalink

      Hey Juska,

      Unless Flickr have changed their interface, I don’t think so – it’s currently just “OR” (automatically).

  12. Posted October 29, 2010 at 6:12 am | Permalink

    Hey Michael!

    I recently created a wordpress blog and added the flickr widget. I was wondering how long it should be taking to sync photos from flickr to wordpress? I can share them from my phone or camera and I instantly see them on flickr, but it takes quite a while for them to pull into the widget. Is there anything I can do to speed up the process?

    Thanks :)

    • Posted October 29, 2010 at 2:07 pm | Permalink

      There is: Open up flickr.php, and change the CACHE_MAX_AGE value to something less

  13. Henrik
    Posted October 31, 2010 at 10:37 pm | Permalink

    Thank you, works great!

  14. Posted November 2, 2010 at 9:13 pm | Permalink

    How can we make the plugin pick larger photos. Right now when you click on the thumbnail and the lightbox comes up it seems to be picking the smallest photo, I would rather it select the large version of the photo.

  15. Mike
    Posted November 17, 2010 at 6:45 pm | Permalink

    WordPress.org says Flickrpress is only compatible with WP 2.9.X – will it work with 3.0.1?

    Thanks

    • Mike
      Posted November 17, 2010 at 7:23 pm | Permalink

      Doh! Seems to work fine but only with the “rss” feed type – “photostream” produces the dreaded “Flickr is not available” error message. When generating a Flickr API key, Flickr also provides a secret along with the key – does this need to be used in the shortcode?

  16. Posted November 24, 2010 at 6:41 am | Permalink

    For some odd reason, the sidebar widget for Flickrpress, when you click a photo it no longer loads as a slideshow. You click an image and it acts as if it will, and then just takes you to a new page with the single image. It was working before, have no idea why it’s not now. Tried deactivating and reactivating both the Flickrpress widget and the Lightbox 2 plugin. Images in my posts load correctly. Just now with the flickpress plugin.

    Anyone know why this is occuring?

  17. Posted December 12, 2010 at 7:29 pm | Permalink

    Hi there – first off, thank you so much for this plugin. It looks beautiful. I’ve been using it for a long time. However, I’ve noticed that it causes a lot of errors in my WordPress error log. I’ve not changed any settings and my photos usually show up. Is there a reason for the errors? According to my error log it says the RSS load failed. There are lots of these errors and they happen at least once a day.

    • Posted December 12, 2010 at 11:07 pm | Permalink

      Hey Liz – I’m not sure, it may be Flickr having congestion issues. I probably wouldn’t worry about it (or you could also try putting the cache age up in flickr.php – it’s at the top, and defined in seconds – change the “60*60” to something higher, if you like, like 24*60*60 for 1 day)

  18. DC
    Posted December 15, 2010 at 6:56 am | Permalink

    Hi, this could be a stupid question, but here goes.

    I have put in my API from my account but the photoset is a friends – the account name, ID is that his details? I have put in his Flickr ID and then the photoset ID.

    I guess it’ll take time to cache but its saying Flickr is currently unavailable. How long does it usually take for the photos to come through?

    Great plugin and support!

  19. stuart doughty
    Posted January 2, 2011 at 7:49 pm | Permalink

    I was just wondering something. Every time i try to use flickrpress, all of the other items (none widget) disappear. if i remove the flickrpress widget again they all come back. What would be the code needed to hard code this into my sidebar.php? as i believe this would be the easiest work around.

    Many Thanks

    Stuart

  20. Posted January 16, 2011 at 2:15 am | Permalink

    I’m putting together this wordpress site and installing your flickr widget, which is perfect… except for the fact that when it opens with lightbox it seems to pull the image title as well as as an link. like this: P!NK’s Fun House Tour | View at Flickr

    Any thoughts on how I can change that?

    Thanks!!

    Brad

    • Posted January 16, 2011 at 2:17 am | Permalink

      oh, well, in the message I just left, the link works. ha. but it is just the <a href code in the ligthbox. thx!

    • Posted January 16, 2011 at 12:09 pm | Permalink

      Hey Brad,

      Oh, that’s very odd! What Lightbox system are you using?

      You could try opening up flickr.php in the plugin, find line 388 in the function flickrpress_render_items. Replace the lines:

      title="<?php echo htmlspecialchars(($item->title?$item->title.($item->description?": ":""):""). strip_tags($item->description).($item->title||$item->description?" | ":"").($item->page ? "<a href=\"$item->page\">View at Flickr</a>" : "")) ?>">

      With something like:

      title="<?php echo htmlspecialchars(($item->title?$item->title.($item->description?": ":""):""). strip_tags($item->description).($item->title||$item->description?" | ":"")).($item->page ? "<a href=\"$item->page\">View at Flickr</a>" : "") ?>">

      That is, move the link part outside of the htmlspecialchars call, so that it’s not escaped.

  21. Posted January 20, 2011 at 4:43 pm | Permalink

    Hi

    Great plugin, wondering if I can disable the link to Flickr on the actual image. I want the user to stay on the site and go to a particular page (via a text link).

    Would be happy to make the image not a link at all.

    THANKS

    • Posted January 20, 2011 at 4:59 pm | Permalink

      Hey,

      Sure – open up flickr.php in the plugin, find line 388 in the function flickrpress_render_items. Replace the lines:

      title="<?php echo htmlspecialchars(($item->title?$item->title.($item->description?": ":""):""). strip_tags($item->description).($item->title||$item->description?" | ":"").($item->page ? "<a href=\"$item->page\">View at Flickr</a>" : "")) ?>">

      with:

      title="<?php echo htmlspecialchars(($item->title?$item->title.($item->description?": ":""):""). strip_tags($item->description).($item->title||$item->description?" | ":"")) ?>">

  22. Posted January 20, 2011 at 5:15 pm | Permalink

    Hmmm, that I did, but still linking to Flickr. (see “Altar Boxes” image. That is using the shortcode) http://www.alteregomexicana.com

    Can we keep trying?

    Thanks!

    • Posted January 20, 2011 at 5:56 pm | Permalink

      Oh I see, you’re not using Lightbox at all. In that case, you can delete that <a... line altogether, as well as the ending </a> tag. That’s lines 386-392, and line 395.

  23. Grant
    Posted February 18, 2011 at 8:53 pm | Permalink

    This may be a silly question and I’m probably overlooking something quite obvious, but I’m wondering how to get the API for my account or the process of accessing that. I downloaded flickrpress and have a solid stream of flickr photos together, but am not entirely sure how to get them to communicate. It seems like the API is the main thing that I’m missing, and I’m wondering what I need to do in order to fill that gap. Thank you very much for the help all!

  24. Posted March 5, 2011 at 4:14 pm | Permalink

    I am having a strange problem with Flickpress – I have two instances being called on one page, and a sidebar widget.

    First Instance: [flickrpress type=”photostream” account=”tiredofit” count=”1″ api_key=”9ae29e70c303aa3246437195ba11b42c” pagination=”false” lightbox=”false” tags=”me” view=”large” random=”true”] 2nd: [flickrpress type=”photostream” account=”tiredofit” count=”8″ columns=”4″ api_key=”9ae29e70c303aa3246437195ba11b42c” pagination=”false” lightbox=”true” view=”square”]

    When I add the second the content page goes blank, and I can’t see anything on the page. Am I missing something here? is there a log I can look at to get information?

    • Posted March 12, 2011 at 7:36 pm | Permalink

      Hey Dave,

      I can’t say I’ve seen that before – hopefully you’ll see something in your webhost’s error log, but where that is depends on your host, so I can’t direct you straight to it, I’m afraid.

  25. Olga
    Posted March 21, 2011 at 10:10 am | Permalink

    Hello! I install your plugin, it works, but I found a mistake. I want to show random favorite photos from Flickr.com I see photos, but when I press button on one of the photos I see on flickr.com “This is not the page you’re looking for, It seems like you’re trying to see one of your own photos or videos.”

    Your plugin used a path to photo: http://flickr.com/photos/user_id/id_photo but it’s not correct. Correctly is: http://flickr.com/photos/screen_name_author's_photo/id_photo/in/faves-user_id/ How fix it? Thank you

  26. Olga
    Posted March 21, 2011 at 10:41 am | Permalink
  27. Posted March 31, 2011 at 11:27 pm | Permalink

    To adjust the lightbox image size:

    file: includes/interface.php line: 159 code: $item->image = $flickr->buildPhotoURL($photo, 'SIZE YOU WANT'); size options: m640, large, original, etc.

    • Posted March 31, 2011 at 11:33 pm | Permalink

      Actually I take that back. m640 doesn’t exist, you have to add that to the array in includes/phpFlickr/phpFlickr.php on line 295 add:

      "m640" => "_z",

      This will enable you to put m640 on line 159 of includes/interface.php. :)

  28. Posted March 31, 2011 at 11:29 pm | Permalink

    To adjust the lightbox image size:

    file: includes/interface.php line: 159 code: $item->image = $flickr->buildPhotoURL($photo, ‘SIZE YOU WANT’); size options: m640, large, original, etc.

  29. Posted April 10, 2011 at 10:26 am | Permalink

    First, thank you for a grate plugin – just the plugin I been looking for. :)

    I have a strange problem though… Every time I’m gonna use photos in my post, I have to deactivate the plugin otherwise I’ll get a HTTP-error and the file is Crunching. Is there anything I can do, so I don’t have to remember to deactivate and activate again?

  30. Posted April 28, 2011 at 9:48 am | Permalink

    I am getting such error. http://awidea.com/demo/

    Notice: Undefined variable: account_id in /home/awidea/public_html/demo/wp-content/plugins/flickrpress/includes/interface.php on line 73

    Notice: Undefined variable: results in /home/awidea/public_html/demo/wp-content/plugins/flickrpress/includes/interface.php on line 83

    Can anyone please help whats wrong here.

    Thanks

    • Posted April 28, 2011 at 10:20 am | Permalink

      Hi Hussain,

      That’s not so much an error bug a series of verbose warnings from PHP – you want to turn off E_NOTICE printing from your PHP config.