jQuery Google Plus & Picasa Photo Slideshow Plugin - Google slides

File Size: 14.1KB
Views Total: 5906
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Google Plus & Picasa Photo Slideshow Plugin - Google slides

Google slides is a jQuery slideshow plugin that displays your photos from Google plus & Picasa albums in a customizable slideshow with fade animations and image caption support.

See also:

How to use it:

1. Load the latest jQuery javascript library on your web page.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

2. Load the jQuery google slides plugin files on the web page.

<link href="src/jquery.googleslides.css" rel="stylesheet" type="text/css" />
<script src="src/jquery.googleslides.js" type="text/javascript"></script>

3. Create a container where you want to place the slideshow.

<div id="demo1">
</div>

4. Get your Picasa/Google plus User Id & Album Id and enter them in the javascript as shown below. Any album you want to display with this plugin must be marked for 'Public' sharing from Google.

<script type="text/javascript">
$(document).ready(function () {
$("#demo1").googleslides({ 
userid: 'USER ID', 
albumid: 'ALBUM ID'
});
});
</script>

5. All the options.

<script type="text/javascript">
$(document).ready(function () {
$("#demo1").googleslides({ 
userid: 'USER ID', 
albumid: 'ALBUM ID'
authkey: '', // If albumid is shared with 'Limited' visibility, you must provide your album authkey.
imgmax: 460, // Max size, in pixels, of the photos. (Note: A value of 100 will produce square sized thumbnails.)
maxresults: 100, // Max number of photos to show from the album.
random: true, // Randomize the order the photos are displayed in.
caption: true, // Show the photo caption, if available.
albumlink: true, // Link the photos to the Google album page.
time: 5000, // Time to show each photo before advancing (in milliseconds).
fadespeed: 1000 // Fade in/out speed (in milliseconds).
});
});
</script>

This awesome jQuery plugin is developed by bradyholt. For more Advanced Usages, please check the demo page or visit the official website.