Google AJAX Feed Slide Show Widget

This is a wordpress plugin that displays a photo slide show as a sidebar widget or in lined in your posts using a shortcode. The plugin uses Media RSS as a source and Google AJAX Feed API Slide Show.
You can easily display a slide show from photo feeds from all popular sites, such as Expono, PhotoBucket, Flickr, and Picasa Web Albums.

If you use Flickr I recommend you to run their media RSS feed trough this yahoo pipe to get medium size images since they only has small defined as thumbnails.

If you got questions, comments or feedback please leave a comment.

Example

Latest photos from expono.com using shortcode.

Loading...

Se my sidebar “Photos” for widget example.

Screenshots

Shortcode syntax

Don’t forget to set the height or make sure the classname has a height if you don’t it won’t work. If you want the images to be linked to it’s source you have to set the link_target parameter.

Example
[mj-google-slideshow feed_url="http://www.expono.com/go/rss" width="300" height="300" link_target="google.feeds.LINK_TARGET_BLANK" /]

Required parameters:

  • feed_url = URL to the feed

Optional parameters:

  • display_time = value in ms, default 2000
  • transition_time = value in ms, default 600
  • scale_images = boolean value, default true
  • maintain_aspect = boolean value, default true
  • pause_hover = pause slide show when mouse is hovering (boolean), default true
  • full_control_panel = boolean value, default false
  • full_control_panel_small = boolean value, default false
  • link_target = If images are linked to its source, accepted values (false, google.feeds.LINK_TARGET_SELF, google.feeds.LINK_TARGET_BLANK, google.feeds.LINK_TARGET_PARENT, google.feeds.LINK_TARGET_TOP) default false
  • thumbnail_size = Thumbnail size to use, this only works on feeds that expose different sizes. Accepted values (GFslideShow.THUMBNAILS_LARGE, GFslideShow.THUMBNAILS_MEDIUM, GFslideShow.THUMBNAILS_SMALL) default GFslideShow.THUMBNAILS_LARGE
  • num_results = Number of images to display
  • classname = class name for the surrounding html container
  • width = slide show width in pixels
  • height = slide show height in pixels

Boolean types accepts values (1, on, true) everything else is evaluated as false.

Styling

The sidebar main element uses classname .gglslideshow. The slideshow container uses the classname supplied from the widget option dialog.

Example style

.gss a img {border : none;}
.gss {
   text-align:center;
   background-color: #000;
   padding: 8px;
}

Requirements

WordPress 2.8

Installation

1. Download the installation zip file and unzip leaving the directory structure in tact.
2. Upload the newly unzipped ‘google-ajax-slideshow’ folder to the `/wp-content/plugins/` folder
3. Activate the Google AJAX Feed Slide Show Widget plugin from the ‘Plugins’ menu.
4. Add the widget to your sidebar from the ‘Widgets’ design page.

Download

google-ajax-slideshow

  • http://www.martinj.net martinj

    I haven't tried the plugin in WP 3 so it might be some problem with that.

  • Danielriem

    I was curious if you have been able to get Facebook Photos to show up on the plugin?

  • http://www.martinj.net martinj

    Haven't tried it. Shouldn't be a problem if they have media RSS that's accessible.

  • Danielriem

    how do you know if they have a media RSS?

  • http://www.martinj.net martinj

    Try searching on Google for the information or email their support.

  • Kasia

    great plugin indeed, after a while it all worked just fine! thanks!
    I have just a little question – is it possible to align all pics to one side instead of center? when they ‘re different size on picassa for example, it makes all of them smaller (Iwant a thumbnail of a whole pics to show) which leaves a gap to the left and right. For design reasons I would rather need them to one side – is that possible? for example to adjust the images to the top-left, what code would I need to place and where?

  • http://www.martinj.net martinj

    This would require CSS knowledge for you to fix.
    You can try removing text-align:center; from the .gss class if you are using the default styling.

  • Kasia

    hi,
    great plugin. How can I make the pics show randomly? I didn’t get it…

  • Doug

    I am relatively new to WordPress and want a Slideshow in the Widget Secondary Area, just where this one is. I have installed AJA Feed Slideshow as per instructions above, and am using an RSS Feed from 6 photos on PicasaWeb. On pressing the RSS button at Picasaweb, I got a lovely looking RSS Feed file, and am using its URL as the Feed URL for AJAX. Photos are all 300×220 px, around 35 KB. BUT I keep getting “feed could not be loaded” error. Anybody have any suggestions ?? Thanks.

  • Doug

    I should also say that I tried Martin’s Feed URL for the Widget Slideshow above (http://www.expono.com/martinj/rss) and it worked fine. I have used as Feed URL the URL for the RSS Feed generated by Picasaweb for my 6 photos, namely: feed:https://picasaweb.google.com/data/feed/base/user/straussjoy/albumid/5571740038923748689?alt=rss&kind=photo&authkey=Gv1sRgCLSY9_SZvc7iVw&hl=en_US. This is very possibly incorrect; if so, what should I use ??

    My Picasaweb photos are open to the public at: https://picasaweb.google.com/straussjoy/WidgetSlideshowPhotos#

    The Website I am attempting to put the Widget Slideshow into is at:
    http://www.artistquarterguesthouse.com/

    Thanks.

  • Doug

    My mistake … the widget works beautifully … I neglected to remove the “feed” from the front of the PicasaWeb URL … sorry

  • http://salesresultsllc.com Craig M. Jamieson

    Hi Martin, I luv your plugin but have recently developed a problem where the images are either not scaling up or are only showing the upper left hand corner of the image and that appears in the lower right hand corner of the image slide box. This seems to be only happening in Chrome. Works fine in FireFox. Used to work fine in Chrome. Did the Chrome 10 update that just came out this morning and that did not fix it. Any ideas? Thanks!

  • Pingback: Google AJAX Feed Slideshow Widget Review by Best Plugins for Wordpress

  • Nigelparkes

    what is the class name for photobucket. im new to this.
    I cannot get past ‘feed cannot be located’
    can anyone help

  • Nigel

    can anyone help me. I am trying to link pictures for a charity.
    I have used wordpress to store some pics. but now i am lost. what should the url be and what is the class name for photobucket. im new to this.
    I cannot get past ‘feed cannot be located’
    can anyone help
    Thanks

  • The Bungalow Guy

    Great Widget!

    I am getting this error:
    Warning: uniqid() expects at least 1 parameter, 0 given in /homepages/19/d362134408/htdocs/wp-content/plugins/google-ajax-feed-slide-show-widget/google_ajax_slideshow.php on line 53

    on my page:
    http://s362134419.onlinehome.us/?page_id=178

    Can you tell me which parameter I am not setting correctly and how I should be setting it?

    Thanks

  • Cathy T

    hi martin
    great plugin, can see hoe to put it into a wordpress sidebar but am struggling to insert directly into a wordpress page…  i tried pasting in the entire widget code but guess i am picking up too much.  any pointers much appreciated. I am a non-techie.
    thanks
    nelipot

  • Rainer Alföldi

    Hi Martin,

    great plugin. Works like a charm… except on Google Chrome. For some reason after a refresh (F5) pictures sometimes (70%-80%) only display in the lower right corner 🙁

    This even happens on this page with your  expono.com slideshow.

    If you look at the html the images have top:150px; left:150px; (on this page) and 200px on my page.

    Any ideas?

    Greetings from Bern

    Rainer

  • http://www.martinj.net martinj

    Seems fine on my site with the latest version of google chrome.

  • Rainer Alföldi

    Hi Martin,

    thanks for the reply.

    On the first go everything is fine. After a refresh or if you display the page again it gets messed up – and then not all the time. 
    As Chrome is always up-to-date 🙂 we’re both using the same version (12.0.742.112), but this has been a problem for a fairly long time.

    I don’t have a clue of php and I have’t had a look at the code, but I do know a bit about HTML.

    This is what the code of broken pics looks like: width/height are missing. top/left are set to 200px.

    This is a correctly displayed pic: width/height are correctly set. top/left position pic according to orientation.

    BOTH in the same slideshow. BOTH from the same picassaweb album and BOTH work when the page is displayed the first time.

    I can send the original website if needed.

    Greetings from Bern

    Rainer

  • http://www.martinj.net martinj

    Then there is some problem with the implementation of the actual slideshow script from google this doesn’t have anything to do with the wordpress plugin.

  • Rainer Alföldi

    This is from THIS page about 20 seconds ago:

    And it only displays in the bottom rigth corner.

  • http://www.martinj.net martinj

    Still got nothing to with the implementation of the wordpress plugin since it uses another product. If you read the complete post you would know that the plugin uses Google Ajax Feed Slideshow. I suggest you head over to http://www.google.com/uds/solutions/slideshow/index.html and ask them to fix it.

  • Rainer Alföldi

    Ok… and the bug shows up on their page as well… thanks anyway.

  • http://www.bikingindallas.com Mr Christopher

    I will be insanely happy if this wdiget does what I’m wanting it to do. I want a sidebar widget that will rotate photos from a folder that I create on my blog. I can do that, yes, I don’t have to use some off site source for photos correct?  And is there the ability to make the photo change only when the viewer clicks on a different page?  Ideally I only want the photo to change as they click on various internal page links.  Thanks and I’ll be experimenting with this tonight.

    Chris

  • http://www.bikingindallas.com Mr_Christopher

    Martin I put the widget in my bottom, center footer. I get the dreaded feed could not be loaded.  Here is my source http://www.bikingindallas.com/wp-content/uploads

    Any suggestions?

  • http://www.martinj.net martinj

    As far as i know Google Ajax Slide Show only supports media RSS format as a source, i suggest you read about its capabilities at http://code.google.com/apis/feed/v1/

  • Legendaryiron

    thankssssssssssssss

  • Mike

    I’ve done all I need to do several times over and I still get Feed Cannot Be Loaded in the slideshow on the sidebar. I’ve used this photobucket URL http://photobucket.com/frogonalimb as I was supposed to but I get the same message every time. What am I doing wrong?

  • http://www.martinj.net martinj

    Thats not a feed url. You need to specify an url pointing to a Media RSS. I guess  you should use this url http://feed1249.photobucket.com/albums/hh505/Frogonalimb/feed.rss

  • Nathan Jones

    Hi Martin,

    Thanks for the awesome plugin. It works great and I love using it. One question though, is it possible to change the link of the images to an external site somehow instead of just going to the image in the feed?

    Thanks.

  • http://coffee-clouds.com/ SSK

    Thanks so much for this awesome plugin! After searching a long time for a simple AJAX slideshow that would automatically grab my Photobucket album (no love for PB among developers, I think!) I finally found a great one. =) Using it on my site, thanks a lot! 

  • http://coffee-clouds.com/ SSK

    While I loved your plugin, just a quick question – is it possible to have the slideshow display the title of the pictures (as they are on my Photobucket album, for example)? Sorry if this is a dumb question, I know nothing about coding, and couldn’t find anything in the comments about this. 

  • http://www.martinj.net martinj

    There is no such functionality available.

  • http://www.martinj.net martinj

    If defined in the feed according to Media RSS standard those links can be used.

  • Ken Penner

    Just installed your plugin. Implemented with Shortcode as follows:
    [mj-google-slideshow feed_url="https://picasaweb.google.com/data/feed/base/user/117465981423760585894/albumid/5292823688994471105?alt=rss&kind=photo&authkey=Gv1sRgCK2P0_mf3ePK4AE&hl=en_US" full_control_panel_small=true thumbnail_size=GFslideShow.THUMBNAILS_LARGE width="300" height="300"]

    Works, except the two paraemters full_control_panel_small, and thumbnail_size do not work. The parameter full_control_panel=true works. But not the small one. I haven’t got the thumbnails to show regardless (and the slide show source has different sizes).
     

  • http://www.martinj.net martinj

    try putting all values inside quotes e.q thumbnail_size=”GFslideShow.THUMBNAILS_LARGE “

  • Frank

    Hello Martin,
    thanks a million for this post, it really helped me to get new knowlledge and useful ideas!

    I would like to contact you: is there a web page where I can write you or find your contacts?

    Bye,
    Frank