Within the CMS work area, go to the folder where you want the carousel to appear. In the right-hand window, hover over New and then Smart Form. The Carousel option should appear on the menu.
When the carousel form opens, you will see various fields. First, title the form. As no one will see this title but web maintainers, make it descriptive so others will know what it is without needing to click on it, for example: “carousel: history homepage”
IntroductionThis can be left empty. Text in here does not appear on the webpage.
Carousel WidthFor the purpose of this form, imagine the webpage as divided into two equal columns. A full-width carousel will span the top of the page. A half-width carousel spans one column, or half of the page. A quarter-width carousel spans half a column, or one-quarter of the page.From the drop-down menu, choose full width of the page, half-width, or quarter-width. (Do not use “edge to edge.”)
AlignmentThis formats the carousel for placement on the left or right side of the webpage, or for the full width. For half- or quarter-width carousels, choose left or right alignment. Full-width carousels must use the full width alignment.
Image Width (in pixels)Enter the width of the images to be used. Remember that all images must be the exact same width and height. Note: This option does not size the images. It only tells the form the size of the images that are being used.
Image height (in pixels)Enter the height of the images to be used.
Gutter Width (in pixels)If more than one image is displayed at a time, the gutter width should be set at the default width of 10.
Number of Images VisibleThis instructs the form how many images will be displayed at once within the carousel. (This is not how many total images are used.) Use the Image Widths chart to determine how may images should appear. For example, if you use quarter-width images in a half-width carousel, the pictures will be 130 pixels wide and two can be displayed at once. But if the pictures are half-width on a half-width carousel, only one can be displayed at a time, and so “1” should be placed into this field.
Auto Play SpeedThis is the speed at which each image slides across the screen during the transition. Note: This is in milliseconds, so if you want the picture to take three seconds to slide across the screen, set this to 3000.Suggested Auto Play Speed: 4000
SpeedThis is the length of time between each transition of images. This is also in milliseconds. If you want the images to change every four seconds, set this to 4000.Suggested Speed: 1500
Setting Auto Play Speed at roughly half of the Speed setting is usually easiest on the eyes.
This is the section where an image will be placed.
To add an additional image, click on the blue “+item” link. This will open a new Item section. Repeat this for additional images.
To reorder or remove an image from the carousel, click once on the little box at the upper left of each section, just above the red “Item” heading. A menu will appear. You can now move the section up or down (one section at a time), insert a new blank section above or below this one, or delete the current section. Any Item section must have its fields filled in before checking in or submitting the carousel. All fields bordered with a red dotted line are required.
Carousels are added to a page by placing it within the correct section of that page’s metadata tab.
Fraud, Waste, and Abuse Hotline
© 2007–16 Indiana University of Pennsylvania
1011 South Drive, Indiana, Pa. 15705 | 724-357-2100