Website Editor: Quick Guides

How to add and edit an image slider


Showcase your pictures in an animated carousel using our Image Slider. You can add or remove pictures and add custom titles and links to any image.

Add Image Slider

  1. From the Manage Pages section of the navigation (or from the drop down menu in the top left), select the page you want to add the Image Slider to.
  2. Go to the Add Element section and scroll to the media tab.
  3. Drag the image slider feature into the editing frame.
  4. Once you’ve placed the element, select images to display.

Set up the Image Slider

  1. Press the Add Image button and the Choose & Place Images pop-up will appear.
  2. Click to select an image. You can select multiple images. Selected images will have a blue border around them.
  3. Press Done.


Change the Image slider’s look using the following display options:

General – The General tab is where you would choose to add, delete or crop images.

To add an image, simply click on square that says “Add images”. If you have many images, you may have to scroll down to find this option.

Hovering your mouse over any the images in this menu will reveal additional options for each image.

edit individual images

Delete Deletes the image from the photo slider
Link You can set up a link for the slider to bring users to when a slider is clicked.

Existing Page: Links the slider to an existing page

Website URL: Links the user to a website URL

Link to a file: Links the user to a file that you uploaded in Images & Content

Email Address: Prompts the user to send an email when clicked

(Brings you to a new menu)
Layout 1 and Layout 2: Two types of layouts for your slider. There are different options for each of these layouts, but all the options are listed below.

Toggle slide content: Turn on/off slide content to show the text.

Color Overlay (L1): Color overlay for the entire slider

Text Background (L2): Color overlay for text

Title (L1): Title of the post

Text: Text of the post

Button (L1): Button (Leave blank to show nothing)

Alt (L1): Alt text

Edit Slide Link (L1): Edit the slide link for the slider

Position: Position of the text

Animation: Set an animation for the slider


Previous/Next Slide: Toggle between slider images for quicker editing

(Brings you to a new menu)
Crop your image. Note that can re-crop your image as many times as you want and even crop it back to it’s original size.



Design – Design is where you will find options for styling your photo slider.

Effects       Hide slide content: Hide the slider’s text content

Images fill slider: Have the images resize themselves automatically to fill the slider (no white space)

Autoplay: Automatically changes the images without user input

Show navigation arrows: Show the navigational arrows

Animation: Set an animation fo the slider when it first shows up on the page

Color Note: Background image and color won’t show if “fill slider” option is set to on.

Backround: Choose a background image for the slider

Color: Choose a background color for the slider



Advanced options for the slider.

Spacing         Margin: Set the margins for the slider

Height: Set the height for the slider. Adjust this option if your slider isn’t showing properly on the mobile or desktop view.

CSS Add CSS for all devices or for the desktop and tablet views
HTML Edit the HTML for the site.