Blip Slideshow Examples 2/2

A SmugMug slideshow with links and thumbnails disabled:

[blip-slideshow link=none thumbnails=false rss=feed://]


A MobileMe slideshow with a lightbox. WordPress plug-in “Lightbox Plus” has been installed and activated (click the image to view).

[blip-slideshow captions=false link=lightbox thumbnails=false rss=


A Flickr slideshow with uncropped photos linking to the original Flickr galleries. Inline styling tells the browser how much space to leave for the the thumbs. If you said to yourself “what the heck is inline styling!”, be sure to read the section on Styling Blip Slideshow for tips.

[blip-slideshow link=href captions=false controller=false fast=2 overlap=false resize=fit rss=feed://]
<style>div.slideshow {margin-bottom:95px}div.slideshow-thumbnails {height:95px;bottom:-95px}</style>


A Google Picassa Web slideshow.

[blip-slideshow rss=]
<style>div.slideshow {margin-bottom:86px}div.slideshow-thumbnails {height:86px;bottom:-86px}</style>


A Photobucket slideshow. A “default” image has been added in the shortcode content in case the visitor has Javascript disabled.

[blip-slideshow thumbnails=false rss=feed://<img src=""/>[/blip-slideshow]

Cat Fail


Continue to the Styling Blip Slideshow page for more options.

12 Responses to Blip Slideshow Examples 2/2

  1. Leigh says:

    I’m brand new to CSS and am muddling my way through WordPress. I would love to add this slideshow, but it seems I’m missing something very, very basic.

    I’ve added the plugin
    Activated it
    Copied the external Picasa code
    Added the RSS feed link
    Posted it to a new page in HTML

    Please help! What am I missing?

    Thank you!

    • jason says:

      Leigh, I notice you have activated the Jetpack plugin on your Blog. Jetpack also defines a [slideshow] shortcode which is taking precedent over Blip. To activate Blip in your blog post, use the shortcode [blip-slideshow] instead of [slideshow].

  2. Spidey says:

    Hi Fred,

    How can I align the slideshow to the left?
    Here’s my code..
    [slideshow resize=fill loader=false width=700 height=478 link=none thumbnails=false captions=false loop=true delay=5000 rss=]

    It displays the slideshow to the center of my website.. it should be just at the left.

    • jason says:

      Create a file called blip-slideshow.css in your theme and paste the following:

      div.slideshow {
      div.slideshow-thumbnails {

  3. Fred says:


    This plugin is not working on my site. See here:

    WP and plugin are up2date

    No prototype.js (afaik)

  4. Gabesz says:

    How can I set the showed files? I deleted the files in the wp-contentpluginsblip-slideshowSlideshowimages folder and I rename the files from 1 to 16 but it dont play only the first 4.
    So, how can I set to play all file in my folder.


    • jason says:

      At this moment, Blip does not read files from a folder. It only reads them via RSS. This means you must have an account with SmugMug, Flickr, Picasa, Photobucket, MobileMe, or another photo-sharing service.

  5. Talina says:

    I must be missing something very obvious here because the short code simply will not display the slideshow on this page:

    I installed, activated, grabbed the correct rss album feed, put short code in the html and in visual editor modes… Nothing makes it display :(

    • jason says:

      Hi Talina. When I visit your site, I see you are using “Protoype”. Unfortunately, MooTools, upon which Blip is built, is not compatible with Prototype.

  6. Daniel Vernon says:

    Is there any way to just publish the thumbnails?

    • jason says:

      Sure, first turn off the slide captions, controller and loader:
      [slideshow captions=false controller=false loader=false]

      And then add some CSS to hide the slides into your theme’s blip-slideshow.css:
      div.slideshow {margin-bottom:65px}
      div.slideshow-images {display:none}
      div.slideshow-thumbnails {height:55px}

Leave a Reply

Your email address will not be published. Required fields are marked *


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>