This project is read-only.

SharePoint Slideshow webpart shows all the pictures from the picture library as thumbnail image in the webpart in pages. On Clicking of each thumbnail, the images will be seen in a pop–up, again in a slideshow.

The below plug-ins have been used for the development

Jquery Lazy Load:

Lazy Load can make the page load a lot faster. Lazy Load is a jQuery plugin that delays loading of images until they are actually visible in the page. Images in the next pages(visible part of web page) will not be loaded before user goes to next page.

Check Lazy Load to read the documentation and to download the last version.


Pagination is done using client-side pagination plugin.

Check jPages for more information about the plugin.


A lightweight customizable lightbox plugin for jQuery.

Check colorbox for more information.


Figure1.1:Home page Thumbnail with paging.

Note: If you want to change the look and feel of the above thumbnail, update style.css file.


Webpart Settings:

1.1 Slideshow Homepage settings:


Figure 1.2: webpart – SlideShow HomePage Settings.

SlideShow Webpart Title : Set the webpart title. You can include html tag also(e.g. <h3> Title</h3>). 

Items Per Page                     : Set the number of items(Thumbnail image) that needs to be loaded in a Page in the webpart.

Animation Effects               : Select the animation effects; they will be supported only in CCS3 supported browser.

Auto rotate page                 :Set the time to scroll automatically to next page in the webpart in the Homepage.

(in milliseconds)                  Set to 0 if scroll is not required.

Thumbnail Size                     : Default thumbnail used is 160px for optimum quality. This can be changed as required.

Skip loading Jquery,           : Check If Jquery is already included in the master page , Default is false(unchecked).

if already included in Master page

1.2 Slideshow


Figure 1.3: webpart – SlideShow  Settings.

Select Theme            : Four themes are available by default, select one.

Transition                    : Fade, elastic and none, select one.

Sideshow on              : Sideshow will be started when clicking on the image if the option is selected. By default it is true.

Clicking the Image

Slideshow Speed     : Slide Time between images in slideshow.

(in milliseconds)

Image Width              : Set the width of the image in the slideshow (eg:1000px, 740px)

Image Height             : Set the height of the image in the slideshow (eg:1000px, 740px)


Figure1.4: SlideShow Pop-up.


1.3 SharePoint List Details:


Figure 1.5: webpart – SharePoint List Details Settings.

Server Relative web URL   : Enter the name of the site that contains the Picture Library:
                                                      - Enter a "/" character if the Library is contained in the top site(by default).
                                                      - Enter a path if the Library is in a subsite of the current site (eg. in the form of "current site/subsite").

ListName                                  : Specify the SharePoint list name from where the images need to be retrieved.

FolderName                            : Specify folder name (if needed). Only Folders directly below the Picture Library can be mentioned.

Include SubFolders              : Select, if images need to be taken from Subfolders.

No of Images                           : Set the count of images to be taken for the slideshow from library.

                                                        Blank-if you want to fetch all the images.

Cache Expiry                            : Set the expiration time in seconds.

Column Name                         : Specify the column from the list to be used for displaying information in slideshow.

Last edited Aug 20, 2012 at 10:51 AM by Sudarsanan, version 3


No comments yet.