How do I tell a picture story on my website?
July 12, 2010 10:59 AM   Subscribe

I need to embed a slideshow into a web page. These will be pictures with captions that need to be displayed in a specific order. Preferably with an automatic mode and also next/previous buttons. Please guide me in the right direction.

The photos are not the point of the website; it's not a portfolio and they don't need to be downloaded or enlarged. The point is to tell a story using the photos. I don't have access to Flash software but I'm perfectly OK with some kind of free tool that generates Flash or javascript or whatever.
posted by desjardins to Computers & Internet (9 answers total) 6 users marked this as a favorite
 
Flickr has an embeddable slideshow option. Here's an example. You can embed that in any dimension, like a YouTube video (see "Share" in the upper-right corner.)
posted by griphus at 11:04 AM on July 12, 2010


Are you looking for something that would be embedded like Flickr or Picasa, or are you looking for a script that you would host yourself?
posted by Rhomboid at 11:05 AM on July 12, 2010


Best answer: Lots of these available. I'd start with something like supersized. And Here's a list of 15 other options.
posted by seanyboy at 11:06 AM on July 12, 2010 [2 favorites]


You can upload a powerpoint to a Google Docs account and embed that.

Or, if you're making a new presentation, you could play with Prezi (which is a lot of fun, but will take longer).
posted by jander03 at 11:15 AM on July 12, 2010 [1 favorite]


Seanyboy's list is good. There's tons of these out there - look into jQuery or javascript slideshows. This one is my favourite - super easy to customize and the finished product looks sleek and gorgeous.

Alternatively, and this is a bit of a kludge, you could use Lightbox and set up a series of images and your visitors can click backwards and forwards through the slideshow. Advantage: You basically don't have to edit any of the code to make it fit your specifications - you just add a "rel" attribute to your img tag. Also, it overlays your actual page, so people would pretty much only be able to pay attention to the story they're reading.
posted by Phire at 11:21 AM on July 12, 2010 [1 favorite]


Response by poster: Flickr would undoubtedly be the easiest, but the problem is that I can't figure out a way to make the captions automatically appear. They should not require additional clicking or hovering.
posted by desjardins at 11:28 AM on July 12, 2010


If you have Photoshop or another image editing program, you could add white space at the bottom of the pic and type in the caption to make it part of the image...then do the Flickr slideshow or whatever.
posted by radioamy at 11:54 AM on July 12, 2010


Pictobrowser uses Flickr as the feed for photos. It's free, attractive, and easy to customize. If by "captions appear automatically", you mean "titles" it can do that.
posted by bonsai forest at 12:20 PM on July 12, 2010


Have a look at this answer.

Now, the <img /> tags in your case would just be replaced by individual <div>individual slide content</div> items and you'll be done. Then when you initialize it at the top:
$('#my-slides').cycle({
	fx: 'fade', // fade between
	timeout: 4000, // milliseconds between slide transitions
	height: '500px', // height of the slideshow
	pause: true // enable pause on hover
});
Adjust those options to taste.

Feel free to MeMail me if you run into issues..
posted by artlung at 7:12 PM on July 12, 2010


« Older Help find a new toy for an autistic boy   |   Help us find a home for a night (or two) Newer »
This thread is closed to new comments.