Page layouts provide easy-to-use templates for content creators to use when creating SharePoint site content. In scenarios where a certain page design is used repetitively, a page layout is ideal. One example of this is an image carousel used by landing pages. In this recipe, we will create a JavaScript-based image carousel that displays images from a picture library in the SharePoint site.
To simplify the process of creating the JavaScript image carousel, we will use the jQuery framework (http://www.jquery.com) and jQuery bxSlider plugin (http://www.bxslider.com).
Note
This recipe will look for images in the Images picture library in the SharePoint site. Upload a few 750 px wide images (each with a constant height) for the image carousel to use.
For this recipe, we will use the page layout we previously created in the Creating a page layout with three columns of web part zones recipe.