PurpleCow Digital Help Centre

Search for any help questions or topics.

Tutorial: Create Image Sliders

This tutorial will help you create image sliders/carousels
Angie Neal
Updated 1 year ago

Step by step instructions on creating image sliders

When editing a page or post on your website, you can use image slideshows (known as sliders) to display large images, with optional captions. There are a few different types of sliders available with our website software, and the settings vary slightly. These instructions are based on the “Fullwidth Easy Slider” element.

To follow this tutorial, you must first log into your website.

1. Adding the Slider

Click on the “Layout Elements” tab in the page editor.
Drag the “Fullwidth Easy Slider” element onto the page builder canvas area.
Click on the element to edit its settings.

2. Selecting Images

Uploading a single image or video

  1. Click on “Add single image or video” at the bottom of the image list (which will be empty if this is a new slider)
  2. OR click on “Copy and add last entry” to duplicate the last image in the list (if there are any).
  3. Click on the new image row you’ve just added.
  4. Click on “Change Image” to select or upload your image.
  5. Click on the “Change Image” button to add it.
Uploading multiple images or videos

  1. Click the “Add multiple images” button at the top to either upload new images, or select existing images, in the Media Library.
  2. Click once on each image to select it.
  3. Click on the “Insert Images” button to add your images.
Removing entire slides (images or videos)

Just click on the “X” on the right, for the slide in question.

3. Adding Cations

  1. Click on any individual image or video row in the list.
  2. Click on the “Caption” tab at the top and configure options for the caption title and subtitle, position and style, and hyperlink (if any).
  3. Click on the “Save” button to accept your changes.

4. Editing Slider Settings

  1. Configure the settings for your slider. The main options you may want to change from the defaults are:
  • Autorotation: set this to “Active” to make the slides animate automatically, without the visitor having to click.
  • Slideshow autorotation duration: choose how long each slide should be visible.
  1. Click on the “Save” button at the bottom.
  2. Click on the “Update” or “Publish” button at the top right of the page to publish your changes when you’re done.
Did this answer your question?
😞 😐 😃