COS-Pages-Editor

How do I add slides to an Image Slider module?

Last updated: April 5, 2016

Available For:

Product: HubSpot Marketing
Subscription: Basic, Professional, & Enterprise

To add a slide to one of HubSpot's Image Slider modules:

  • Navigate to Content > Website Pages or Landing Pages.
  • Locate the page you'd like to edit, then click the gear icon to the right and select Edit.
  • Hover over the Image Slider module and click to show the module's options.
  • Click the blue Add slide button.

  • Choose the image you'd like to insert as a slide and click Use Image.
  • Once your slide has been inserted, you can add Alt text and choose to show a caption.

  • Click Slider Options to further customize the settings for your image slider.
    • Slideshow: check this box to set your slider to automatically move between slides. You can customize the number of seconds between slides once this box is checked.
    • Loop slides: check this box to automatically repeat your slides. 
    • Show pagination: check this box to add indicators to the bottom of the slider to show visitors how many slides there are and which one they're currently viewing. 
    • Transition: choose which visual effect (Slide or Fade) you'd like to see when transitioning between slides.
    • Display Mode: choose which type of slider you'd like to appear on the page. You can choose a standard slider; a slider with thumbnail images for your visitors to navigate between; or a lightbox gallery, which allows users to click on a thumbnail to open a lightbox and navigate between the full size version of your slides. 
    • Sizing: choose whether you'd like your slider to remain as tall as the tallest slide or resize automatically with each image.
    • Caption Position: if you choose to show captions on your slides, choose whether you'd like these captions to be superimposed on top of your images or displayed beneath the images. 

  • Click Save and go to module list in the top left-hand corner of the image slider options pane. 
  • Click Publish or Update to take your changes live. 

 

Related articles: 

Was this article helpful?