Slickr Flickr

The Slick Flickr Plugin page has moved. See Slickr Flickr Home Page

Slickr Flickr WordPress Plugin

Description : Displays a set of tagged photos from your Flickr account either as gallery or as an unbranded slideshow in posts, pages, or sidebar widgets.
Author : Russell Jamieson
Current Version : 1.5 (updated 08-May-2010)
Download : Download Slickr Flickr from downloads.wordpress.org

Installation

  1. Uncompress the downloaded zip archive in [WordPress install root]/wp-content/plugins
  2. Activate the plugin in your WordPress plugins control panel
  3. Go to the “Settings” section, and choose “Slickr Flickr”
  4. Type In your Flickr Id (it should look something like 12345678@N00) and then click the Save button
  5. To use the plugin in a post, page or text widget use the shortcode [slickr-flickr tag="my tag phrase"]
  6. If you have no photos in Flickr with this tag then no pictures are displayed

Plugin Features

  • Displays tagged Flickr photos as a gallery or a unbranded slideshow (i.e not Flickr’s own slideshow widget)
  • Uses “slickr-flickr” shortcode to make adding a Flickr show as easy as possible
  • Can display more than one gallery or slideshow on the same page
  • Can display slideshows in sidebar widgets
  • Can display slideshows at medium and small Flickr Photo sizes (500 by 375 and 240 by 180 px)
  • Can display slideshows as portrait or landscape
  • Best fits the slideshow if a mix of landscape and portrait photos are used
  • Can display captions for each photo in the slideshow using the photo’s title from Flickr
  • Can alter slideshow settings for each individual slideshow by including attributes after the shortcode (e.g orientation=”portrait”)
  • Uses Lightbox jquery plugin to display each photo in the gallery using an overlaid window

Brief Usage Notes

  • Log in to your Flickr account and tag all the photos you want to display on a particular page of your wordpress site.
    If your tag is more than one word make sure you place double quotes around the tag e.g “South Africa”
  • Back on your wordpress site put into your post, page or sidebar, the following shortcode [slickr-flickr tag="South Africa"]

Demonstration Slideshow

Demo of a slideshow with my photos from Flickr tagged with Bahamas

Nassau Cruise Ship

Steel Band at Atlantis

Atlantis Aquarium

Grand Bahama Hotel Grounds

Me Chilling

Grand Bahama Downtown

Tropical Blue Sea

Cool Art in Hotel Room

Slickr Flickr Screenshots

Gallery with my photos from Flickr tagged with Slickr Flickr with Lightbox display at the original size

How to Use The Plugin

The Flickr show is included within a post or a widget using the slickr-flickr short code

For example to show my pictures from Flickr that have been tagged with “bahamas” I would use :

[slickr-flickr tag="bahamas"]

The Slickr Flickr Attributes (Parameters) are as follows:

Only the “tag” parameter is mandatory – everything else can be defaulted

  • tag – identifies what photos to display
  • id – the Flickr ID of the user – you can get this from http://idgettr.com/
  • group – set to ‘y’ if the Flickr Id belongs to a group rather than a user (default is n)
  • items – maximum number photos to display in the gallery or slideshow (default is 20)
  • type – gallery or slideshow (default is gallery)
  • orientation – landscape or portrait (default is landscape)
  • size – small, medium, large or original (default is “medium” but only use “original” or “medium” for galleries and only use “large” if you actually have large photos on Flickr – over 1024 width typically)
  • captions – whether captions are on or off (default is on)
  • delay – delay in seconds between each image in the slide show (default is 5)
  • start – number of the starting slide in the slideshow or ‘random’ for a random start (default is 1)

You can set the parameters on each individual slideshow or set default values using the Admin Settings.

Examples

The following are example uses of the different parameters.

Gallery of up to 5 of my France photos with popup display at medium size (either width or height around 500px)

  [slickr-flickr tag="france" items="5" type="gallery"]

Gallery of my France photos with popup display at original size.

  [slickr-flickr tag="france" type="gallery" size="original"]

Slideshow of up to 12 my France photos with a delay of 3 seconds between slides displayed at medium size (width around 500px) and without captions

  [slickr-flickr tag="france" items="12" type="slideshow" captions="off" delay="3"]

Slideshow of up to 6 my doggy photos starting randomly which are in portrait format (their width is less than their height) where their size is around 180px by 240px. I would typically use this format for displaying photos in a text widget in a sidebar.

  [slickr-flickr tag="dogs" items="6" type="slideshow" orientation="portrait" size="small" start="random"]

Slideshow of up to 12 photos tagged with Barcelona by Klaus Dolle.

  [slickr-flickr tag="barcelona" items="12" type="slideshow" id="67057161@N00"]

How to Set Up The Plugin Defaults

If you don’t want to specify all the settings for every slideshow you can set up some defaults as follows:

  1. Go to the “Settings” section, and choose “Slickr Flickr”
  2. Enter your Flickr Id (the id of the form 12345678@N00)
  3. You can also change the default settings for
    • the number of photos to show
    • the type of display – gallery or slideshow
    • whether photos captions are displayed
    • what the delay in seconds is before the slideshow moves on to the next slide

Plugin Restrictions

Slickr Flickr has the following restrictions:

  • Flickr serves photos at standard sizes: square, thumbnail, small, medium, large and original. Typically you will use “small” for slideshows in sidebar widgets, “medium” for slideshows in the main content area and either “medium” or “original” for galleries. Slickr Flickr has the limitation of only handling photos at these sizes. However, you can use CSS to resize the photos. The example below shows how to handle a narrow sidebar.
  • There is a limit of 20 photos per gallery or slideshow. This restriction is a result of the number of photos served by the Flickr RSS feed. A simple way to work around this limitation is not to tag more than 20 photos with the same tag. E.g rather than a “Bahamas” tag maybe have “Bahamas 2003″, “Bahamas 2004″, etc
Google Buzz
Share and Enjoy:
  • Print
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks

{ 35 comments }

Sharon March 17, 2010 at 7:50 pm

Hi, I really love your plugin and would like to use it, but I’m running into some difficulty. For some reason, between each flickr image, an arrow (or on my theme, it’s a bullet) shows up. Do you know how I would be able to fix it?

Here is the link to my gallery:
http://www.amiamour.com/gallery/

Russell March 17, 2010 at 8:23 pm

Hi Sharon,

It is your theme, CraftCart, that adds a background element to list elements in your content area with the URL http://www.amiamour.com/wp-content/themes/CraftyCart/images/bullet.gif

If you edit the plugin CSS you can suppress the arrow background images.

- Login as admin on your site
- Go to plugins
- Click Editor
- Select Slickr Flickr
- Click jquery.gallery.css
- Add the line: div#content .slickr-flickr-gallery ul li { background : none; }

I think this will suppress the ‘arrow’ images.

Please let me know if it works

Russell

Sharon March 17, 2010 at 11:46 pm

Russell,

Thanks for the quick response! I edited the jquery.gallery.css by adding in the line, but the gallery still shows up with arrows in between the pics. =(

Russell March 19, 2010 at 11:51 am

Hi Sharon,

I will take another look at the problem this weekend.

BTW when I first posted a response to your comment I had a error in the CSS which I corrected about 30 minutes later. The first version had slickr-flickr instead of slickr-flickr-gallery in the CSS.

Did you use the first or second version when you tried the solution?

Regards

Russell

Russell March 19, 2010 at 12:06 pm

HI Sharon

I checked your changes and you used my first suggestion where I made the typo

div#content .slickr-flickr ul li { background : none; }

Instead try

div#content .slickr-flickr-gallery ul li { background : none; }

Regards

Russell

Sharon March 19, 2010 at 12:21 pm

Thank you, Russell! The changes worked. Now my gallery looks beautiful! I just wish I could do more than 20 pics at a time. I love how the tags give me different ways to organize my gallery.

tracy March 21, 2010 at 12:10 am

hi there ,
I am clearly wordpress challenged and have added this to a post and all that shows up is the text i added
[slickr-flickr tag="wordpress"]
as my post content, can you advise ? thanks !

tracy March 21, 2010 at 6:48 am

meant to say the blog is acornphoto.co.uk/blog

Russell March 21, 2010 at 2:28 pm

Hi Tracy,

It sounds like you have now installed and activated the Slickr Flickr plugin.

If it is installed properly then you should see a menu link on the left hand side in the Settings section. Can you see a link called Slickr Flickr?

Russell

Russell March 21, 2010 at 2:32 pm

Hi Tracy,

I checked the site and your plugin installation if fine.

The issue is with your line of code to include the gallery/slideshow. There are “strong” tags around the square brackets. You can see this by viewing the source of your page.

<strong>[</strong>slickr-flickr tag="wordpress"<strong>]</strong>

The angled brackets appear as ‘bold’ so there are not obvious to the eye.

If your remove the strong tag it will leave you with what you need

[slickr-flickr tag="wordpress"]

Regards

Russell

Andrea March 31, 2010 at 12:40 pm

Hi there!

After a long and deep investigation, I’ve found this plugin that seems amazing!

The only problem is that it doesn’t work with my group.

This is the shortcode I’ve used:
[slickr-flickr tag="blogalbum" id="1423168@N22" group="y"]

I get the message “No photos available for blogalbum”, but if I use the same code with my userid and group set to “n”, I can get the pictures.

Am I missing something?

Russell March 31, 2010 at 4:51 pm

Hi Andrea,

Please can you give me your group name so I can investigate further.

Are the photos for this group public?

When I trying and access the group using the id 1423168@N2 I get no photos returned just this response about the DisForm Pool.

The DisForm Pool, tagged blogalbum http://www.flickr.com/photos/tags/blogalbum/ Wed, 31 Dec 1969 16:00:00 -0800 Wed, 31 Dec 1969 16:00:00 -0800 http://www.flickr.com/ http://l.yimg.com/g/images/buddyicon.jpg#1423168@N22 The DisForm Pool, tagged blogalbum http://www.flickr.com/photos/tags/blogalbum/

The message suggests the id is correct but there is no public content available.

Russell

Andrea March 31, 2010 at 8:33 pm

Russell, the group contents are public (only membership is closed).
Pictures are from this user: http://www.flickr.com/photos/48829962@N02/
…and are public.

User and group name are the same: disform

As you can see, pictures from http://www.flickr.com/photos/48829962@N02/ are visible, therefore I don’t understand why they are not visible also from the group.
Indeed, if I open the group from another Flickr account that is not a member, I cannot see the pictures.
I don’t understand, but at this stage I think is not your fault, but mine: I just don’t see the mistake :)

Russell March 31, 2010 at 8:52 pm

Hi Andrea,

The Slickr Flickr plugin gets photos using an RSS feed. I checked the Flickr help on groups. Although it does not say explicitly it may be that only non member public photos are available via RSS.

The Flickr RSS help has a few things to check if photos do not appear in groups

Hope that helps

Regards

Russell

Andrea March 31, 2010 at 9:30 pm

Russell,

Indeed, the reason might be that the account is too new.
I’ll wait a couple of days to see if something changes and, in case, I’ll contact Flickr support.

Thanks!

Lisa Isbell April 2, 2010 at 1:53 am

Hello,

Trying to use this plugin to display a slideshow of flickr images on my front page. It looks like everything is as it should be but no photos are displayed, there is a message there instead that says “No photos available for online thrift” which is how I tagged the photos.

Did I miss a step? I tagged the photos in Flickr. Here’s my blog address, http://www.whiteoakattic.com

Thanks for any help.
Lisa

Russell April 2, 2010 at 1:06 pm

Hi Lisa,

Please let me know your Flickr Id and I will check this out.

It might be the caching issue I describe in the second item at http://www.wordpresswise.com/slickr-flickr/issues

Thanks

Russell

Lisa Isbell April 2, 2010 at 1:16 pm

Here is my Flickr id – thanks so much for your help
39431406@N04
Lisa

Russell April 2, 2010 at 1:43 pm

Hi Lisa,

The RSS feed that Slickr Flickr uses to read your photos looks fine: see http://api.flickr.com/services/feeds/photos_public.gne?lang=en-us&format=rss_200&id=39431406@N04&tags=online%20thrift

I was also able to display your slideshow on a draft page on my blog using [slickr-flickr id="39431406@N04" tag="online thrift"].

On your site you won’t need to specify the id bit as you do this once on the admin settings.

The fact I can see the slideshow on my site means it is a caching issue of your web server and will sort itself out in time – probably less than 12 hours.

You might be able to force Wordpress to re-read the feed by changing the tag you use in the post from “online thrift” to “online thrift&refresh”. I think this might work but I cannot test it myself as I don’t have a cache issue right now on my site. But you could give this a try if you don’t want to wait.

Also the slideshow for online thrift does not look as good as it could as the photos you have are quite different sizes. The jug is much bigger than the sewing machine instructions. For the best visual experience it is preferable that all the photos are the same size and orientation. The alternative is to use type=”gallery” instead of the slideshow as the lightbox popup is better at showing photos of different sizes.

Russell

Lisa Isbell April 5, 2010 at 5:19 pm

Thanks so much for the quick reply Russell. As you said the photos did update and appear after some time went by.

I went in and changed the tag name on several other photos so they would appear but they aren’t showing yet…is this going to be what happens every time I add photos? Since it is working I didn’t go in and change to this line of text yet “online thrift&refresh”. I’m going to try that now.

Will the slideshow display the photos as large as I put them in? I’m about to address the lack of uniformity in the photo sizes and I don’t want to run into another snag by opting for the wrong size.
I know just enough to break things and create more problems than I solve :-)

Lisa Isbell April 5, 2010 at 5:29 pm

Well, this didn’t take long…I tried “online thrift&refresh”, that caused it to just show one image only but it also displayed the image caption, which I like and is not happening when the images transition through the slideshow.

I put it back to the “online thrift” removing &refresh to get it back to changing the images.

I can live with it just taking some time to update if that’s all it is. Next I just want to address the image sizes and it would be nice if those captions will show on the photos – it would give visitors much more information about each photo.

Thanks again,
Lisa

Russell April 5, 2010 at 8:25 pm

Hi Lisa,

Looking at the RSS feed http://api.flickr.com/services/feeds/photos_public.gne?lang=en-us&format=rss_200&id=39431406@N04&tags=online%20thrift , I can see you have now 12 photos tagged with “online thrift”.

Please look at http://www.wordpresswise.com/slickr-flickr-samples-331. Here I added &refresh to the tag and it is now showing your 12 photos as a gallery.

Regarding your question on the captions on a slideshow – these are just the titles of the photos in Flickr.

It is also possible to pick up the photo description from Flickr (e.g your photo with title “Collectible Pewter Flagg & Homan” has a description of “Vintage collectible antique pewter pitcher Flagg & Homan c. mid 1800′s. See it in the online thrift store”. The question is how to display this information.

What are your suggestions for displaying the photo descriptions: a) in the slideshow and b) in the popup gallery. Permanent text beneath the title, as a mouseover popup, or somrthing else?

Lance Snead April 17, 2010 at 9:52 pm

Excellent job on this plugin!! It is exactly what I was looking for. I can finally kiss Falbum goodbye!

Lance Snead April 17, 2010 at 10:16 pm

It would really be sweet if we could display galleries by ‘set’ and photos ordered by the set’s designation. Is this possible already? or is this more difficult from a development standpoint?

Russell April 17, 2010 at 10:53 pm

Hi Lance,

Thanks for your feedback on Slickr Flickr

Right now the plugin displays the photos in the order as given by the RSS feed – which is the latest photo first.

Since the plugin uses an RSS feed it can only access photos based on the tag, not the photo set id – it is possible to use the Flickr API to do the more sophisticated searches however coding up the API is a bit more development work than I was planning in the short term.

However it is a relatively small amount of work in Flickr just to tag all the photo in a set. And sometimes you don’t want the entire photo set in a slideshow, just specific photos, so I think the requirement to tag is not a great burden.

IMHO the ordering of photos is a bigger issue. I thought about the idea of adding an option where you can sequence the photos based on title. So if you wanted a specific order you could just add titles prefixed by the number e.g. 1. Dodson Creek 2. Downtown Fresno, etc. It is not great however it would be quite quick and easy to add this feature to the plugin.

I plan to release Slickr Flickr 1.4 in a few days and I could add this feature if you thought it might be useful. I would use an extra attribute as follows:

  • sort=”date” direction=”descending” – by date latest first – default option
  • sort=”date” direction=”ascending” – by date earliest first
  • sort=”title” direction=”descending” – by title reverse order
  • sort=”title” direction=”ascending” – by title normal order
  • sort=”description” direction=”descending” – by description reverse order
  • sort=”description” direction=”ascending” – by description normal order

With this approach the numbering can go in the title or the description. However if you add new photos you need to remember to number then otherwise the will just appear at the beginning or at the end depending on the direction.

Please let me know what you think

Regards

Russell

Lance Snead April 17, 2010 at 11:38 pm

Russell,

Thanks for the quick reply. Ordering of the pictures really isn’t a big deal for me personally, but it would be useful if you wanted to show a sequence of events in order. If you feel like it wouldn’t be too much effort, than go for it.
As for displaying sets, that’s the one thing I like about ‘Flickr Gallery’ over Slickr Flickr. I agree that it’s not a burden to tag all photos in a set to achieve the desired result, but it would be cool to just point to existing set without having to tag. I really like the gallery feature in Slickr Flickr because you can explicitly state the size of the photos, where as ‘Flickr Gallery’ you can only show medium photos. That’s a big plus for me.

If I were to sum up some feature requests by ‘most wanted’, I’d say:
1. Display more than 20 photos
2. Display photos by set
3. Use order of existing set when displaying the gallery.
4. Give a link to the flickr page for each picture

Thanks again for the great plugin. I will be checking back when 1.4 comes out.

Lance

Russell April 18, 2010 at 12:54 am

Hi Lance,

Thanks for your thoughtful feedback.

The 20 photos limitation is one imposed by the Flickr RSS feed, however I could get around this by supporting multiple tags, providing the user tags no more than 20 photos with the same tag – e.g 20 photos with “fresno- series one”, 20 photos with “fresno- series two” – again this is a bit clunky. Again this can be handled better if I code up the Flickr API.

The photo set requires the API so will be in a later release

I can add the ordering in Slickr Flickr 1.4

I can add the Flickr Link as an option in 1.4

So two out of four ain’t bad.

Cheers

Russell

roxanne April 20, 2010 at 6:58 pm

Hi, Russell -

Love the plugin :) Just sorting out how to implement it on my site. I agree having more than 20 pics would be great. The one thing I miss about my old gallery plug in is the way it looked on my pages. It let me set number of pics per row and also let me display captions in the gallery view (see this page as an example: http://mongoquest.com/2010/04/18/london-2010-day-five/ ). Is there any way that your next revision could include this type of customization?

Thanks a jillion!
Roxanne

Russell April 20, 2010 at 9:18 pm

Hi Roxanne,

Many thanks for your feedback.

It would be pretty easy to add captions to the gallery in the same way as it appears on the page you gave me. It looks fine providing the titles are short. I will allow the captions=”on” to be added for galleries but I want to keep the default behaviour of captions being on for slideshows and off for galleries.

As for the pics per row I can include this in the next release. Please note it is also possible to set the width of the gallery in CSS which achieves the same result.

I will add the functionality in the next release, 1.4.

The new version was ready to be released however it is sitting on my PC in England and I am sitting in a beach bar in Costa Rica waiting from UK airports to open.

When I get back to the UK I will make the updates and push out the new release

Regards

Russell

roxanne April 22, 2010 at 8:45 pm

Thanks, Russell – You are the cat’s meow! Hope you have a safe trip home… but I suspect it’s not so terrible spending a bit of extra time in Costa Rica :)

Take care,
Roxanne

Escarlata April 24, 2010 at 3:41 am

There’s something in the theme I’m using that won’t allow the slideshow to work. Instead, it’s showing each pictures separately. While I’m considering a theme change, I’m not ready to make that switch any time soon. Would it be possible for you to have a look and give advice on how to fix the issue?

Gregg May 5, 2010 at 2:00 am

I for one think the ordering feature would be quite handy! Hope its part of 1.4

Gregg

Russell May 5, 2010 at 10:13 am

Yes the ordering feature is in 1.4. I plan to release tomorrow.

Russell May 8, 2010 at 5:21 pm

Hi Gregg,

A bit later than intended but ordering in now in place in Slickr Flickr version 1.5

use sort=”date” or sort=”title” or sort=”description” and direction=”ascending” or direction=”descending”

Russell May 8, 2010 at 5:26 pm

Hi Roxanne,

Setting the number of photos per row is now in place in Slickr Flickr version 1.5

For example [slickr-flickr tag="bahamas" photos_per_row="4"]

Comments on this entry are closed.