Image Rotator / Slide Show

Follow

Add Image Rotator / Slide Show Module

The images available for the Image Rotator are controlled by the Images option in the Content Bar. If you need to add images to the Image Library, you must be able to work with Images.

  • Navigate to the page where you want to add an Image Rotator.
  • Click the Content Modules dropdown menu.
  • Select Image Rotator and hover over it.  The mouse cursor will change to . You can then click and hold on Image Rotator  to drag and drop it onto the page. The module will be place above the area that is shaded in light blue.


Image Rotator

1. Click  to edit the Image Rotator.

2. Add Images from a Category

  • The left portion of the window shows the image categories that are available to you to choose images from.
  • Select a category and the images in that category will be displayed.
  • You can now drag and drop images from the bottom area of the window into the gray filmstrip area at the top of the window to create your Image Rotator.

3. Edit Image URL:  Click (underneath the image) to give an individual picture a unique URL.  Enter the URL. (For example:  http://www.google.com).  When users click on the image they will be taken to that URL.

4.  URL:  If you want the Rotator/Slideshow to direct people to a new location, you can enter a URL in the area provided.

  • The URL will load in the same window unless the option to Open URL in a New Window  is selected.
  •  Disable Image Click Events will disable the images from linking to URLs and will keep the pop-up window from displaying with the Image Description.
  • Enable Image Isolation will allow you to create special rotators for certain pages without using another rotator module.  If image isolation is enabled on a page, then you'll need to add the images you want to use on that page to the rotator.  Image isolation is primarily used for image rotators that are built into site templates. By default, when the images are changed in a template rotator, those images change on every page that template rotator exists. Enabling Image Isolation allows you to change images in a rotator, and those changes will only affect the template rotators in that specific channel (changes made at the parent page will affect the child pages below; the change will not affect other parent pages).
For example, admins will commonly enable image isolation at root home and add the images they plan on using for all pages at the root home level.  Then you can go to the pages you need to customize and add the images you want to use on that area.

NOTE:  With image isolation, you will not be able to use the same images in multiple areas.
However, if you want to use a group of images for a channel, then you can add them to the parent page of the channel.
  • Select the Set as a Slide Show option if you want the images to be a slideshow. There will be additional options available after checking the box.  Be aware that the image rotator will no longer be responsive if this option is checked. 

NOTE:  The image rotator will no longer be responsive if this option is checked.  Consider hosting photos on a site such as flickr to create a slideshow and embedding it into a content block on your iModules page.

  • Show Slide Show Nav:  Arrows to allow users to move through the slide show will be shown on the Image Rotator.
  • Slide Duration:  Enter the number of seconds you would like each slide to be shown before moving to the next slide.
NOTE:  Basically the Slide Show makes one giant image left to right with the compiled images you upload.  The limit on the overall width of this image is 32,766px.  So, for example, if your images are all 640px in width, then you would hit the limit after about 51 images.

5. Click Save.

 

Video Tutorials

 

Have more questions? Submit a request