Top Carousel

Plan Availability

Starter
Essentials
Professional
Enterprise

The Top Carousel widget provides a space for you to feature content on banner images. When there are banner images, the top carousel shows one image at a time and the display will automatically change after a short period of time.

The top carousel appears at the top of the page, just below the header menu.

In this widget, you can configure the following:

  • The order in which you want banner images to appear (when there’s more than one)
  • The length of time (in seconds) that you want a banner image to be displayed before the carousel displays the next banner image
  • Set the automatic start and end dates for each banner image to be displayed or display the images indefinitely
  • Display a call-to-action button for each banner image
The recommended top carousel image size is 1920 × 570.

Below is an example of how the call-to-action button and text would be displayed on a top carousel image.

  • Title

    Displayed as a text overlay on the left side of the top carousel image.
  • Subtitle

    Displayed as an overlay below the title (see A above).
  • Call-to-action (CTA) button

    This example shows the CTA button with the player icon enabled. You can also edit the text that appears on the button. The button can link to a webpage (which can be internal or external) or to a video on your platform.

To add a banner image in the top carousel, first follow the instructions in Accessing Widgets, then follow the instructions below.

  1. Click Top Carousel.
  2. Click Add.
  3. If you have the Multi-Language feature enabled, select a language.
  4. Enter a title.
  5. Enter a subtitle.
  6. By default, the image will display with a gradient fade effect. Select Disable image fade effect if you don’t want the gradient fade.
  7. If you want to show a call-to-action button, select Show CTA button.
  8. If you want to show a Play button, select Show Player Icon.
    You can only select this feature if the Show CTA button is enabled.
  9. In the Button Text field, enter the text that you want to appear on the CTA button.
    You can only select this feature if the Show CTA button is enabled.
    • Enter a link. (When viewers click the banner image, they’ll be directed to this link.)
    • OR
    • Click the + button to link to video content on your platform. Start typing the name of the video or live video and a list of suggestions appears. Select the item that you want, then click Add URL.
  10. In the URL Target drop-down, select Same window or New window.
  11. In the State drop-down, select Enabled or Disabled.
  12. In the Position field, use the arrows to change the order in which the banner image will appear. (For example, if you want this banner to appear first in the carousel, you can set the position as 1. For the other ads, set their position as 2, 3, 4, and so on.)When a position is not set, ads will appear in random order in the carousel.
  13. To adjust the start date of the ad, click the calendar button and select the date.
  14. To adjust the end date of the ad, click the calendar button and select the date.

If you want to add another language to the Top Carousel widget, repeat the steps above starting at Step 3.


After you’ve configured the top carousel widget, you can then upload the banner image file.

  1. Click Item Image.
  2. Click Choose File, browse to and select the image that you want to use, and then click Open.

    A progress bar appears to show that the image is uploading.

A preview of the uploaded image appears after it has been uploaded successfully and you can navigate away from the screen.


Setting the Duration of Banner Image Displays

If you have added multiple banner images to the Top Carousel, the carousel will rotate the display of the banners. You can set the length of time (in seconds) that you want a banner image to be displayed before the carousel displays the next banner image.

  1. Click Carousel Settings.
  2. Use the arrow buttons to set the duration (in seconds). (For example, if the duration is set at 5, that means the top carousel will change the display every 5 seconds.)
  3. Click Save.

Your changes have been saved.