Add Rotating Banners to Your Website

  • Updated

Draw customers into your website with large, impactful, rotating images using DC's Carousel block type. 

Before you begin, you will need to have banner images ready & uploaded to your website.
Visit the Upload Images guide, Carousel Image Specs guide and the Free Stock Image Resources guide for more help.

Here's how to add a Rotating Banner to your website using the Carousel block type:

  1. While logged into your DistributorCentral account, open the website editor. Learn How
  2. With your website editor open, go to the panel on the left and find Current Page

    file-BPq8XXiTm6.png

  3. Under Current Page, click the + icon to the right of the row you wish to add the Carousel

    file-xNzu7iX3ZU.png

  4. In the Select Block Type pop up window, click on Carousel

    file-5csjZ9xIrt.png

  5. After you have clicked on the Carousel block you will see the new block added to your row in the left panel highlighted in blue

    file-2KsawNRtWa.png

  6. Click the Pencil icon to the right of the Carousel block

    file-MfvJ0NIO5j.png

  7. The Carousel edit screen will open

    file-RizOttROmT.png

  8. Next, click Add Slide at the bottom of the Carousel edit screen

    file-1N2drlIpAw.png

  9. After clicking Add Slide, Slide #1 will appear with more setting
  10. Click Pick Image, under Slide #1 settings, to select from your image library

    file-vsOKhM9105.png

  11. In the Image Library,  find and click on the image you want to use as your banner
  12. Once the image is added to Slide #1, repeat steps 8 - 11 until you have all your banner images added to the carousel block
    1. Note: You are not limited to a number of images, but you cannot drag and drop to re-sort the images once they are added. If you need to reorder the images you must edit each slide one at a time.
  13. When you've completed uploading your images to slides in the carousel, click Done in the bottom right corner of the Carousel edit section

    file-JAhUivsww6.png
  14. Thats it! Don't forget to Save your changes in the website editor before previewing your website or leaving the editor

    file-bzVnZ2Yxtu.png


Tip: Further edit the Carousel settings to customize things like the Carousel's Animation effect, Autoplay delay, and more!
file-4pDzOzys4r.png

Was this article helpful?

0 out of 0 found this helpful

Have more questions? Submit a request