CAEN Knowledge Base
CAEN Knowledge Base

How do I add a photo Slider (i.e. image rotation) to the top of a page on my site?

An image rotation (or Slider) is a collection of images or photos that you can choose to display in a slideshow to your website visitors. Groups of related photos (or Slide Groups) are made viewable via a large slideshow at the top of a page, above the page title (example shown below):

Note: You can also insert a smaller pop-up slideshow within the body of your page. Click here for more info.


To create a new Slide Group:

  • Go to your site's Dashboard.
  • Click on Slider in the left sidebar menu, then Slide Groups.
  • Click the Add New button.
  • Enter the Group Name. This name will be used by you to identify the group of images, and will not appear to a website visitor.
  • Leave Default in the Template drop-down menu.
  • Click the blue Add Slide Group button:

Once the Slide Group is created, you can start adding images to it:

  • Roll the mouse over the Group Name and click Edit:
  • To add a new slide to the group, click the Add New button. You can then add the slide attributes:

  • Scroll down to enter the Title and Description.
  • Choose an image from the Media Library by clicking on the Upload or choose image button. *
  • Once the Upload slide background image screen appears, click on the desired image and click Use as a background image.
  • Optionally, in the Slide Link area, select a link to appear when the image is clicked. Select either A page or post on this site or An external link. It is entirely optional for the image to have a link.
  • Click Save to record the changes.

*Note: The dimensions in which images in a photo slider are displayed will depend on the number and location of widgets displayed on the page, i.e.:

  • If you are displaying widgets on both the left and right sidebars on the page, you should use images with dimensions of 600 pixels wide by 300 pixels high. 
  • If you are only displaying widgets on a single sidebar on the page, you should use images with dimensions of 750 pixels wide by 325 pixels high.
  • If you are not displaying any widgets whatsoever on the page, you should use images with dimensions of 1075 pixels wide by 325 pixels high.

Ideally, images that you add to the slider should be re-sized and cropped to these dimensions prior to uploading them. Otherwise, the slider will automatically re-size the image, and may stretch or cut off portions of the image to fit.

Once you have added all your images to the Slide Group, and are ready to display it on your page:

  • Go to the page, and click the Edit Page button.
  • Scroll down to the Custom Fields section located immediately below the edit box for the page's body content.
  • Select the Slide Group you just created from the Photo Slider drop-down menu, and click the Update button:


Video Tutorial