Widgets


 





Add Images to a Slideshow Widget

Who can use this feature?

system_admin.pngSlash.pngOwner.pngSlash.pngPublisher.pngSlash.pngAuthor.png

 

Overview 

This article will show you how to add images to a Slideshow widget.

Compliance Notes

  • Ensure that slideshows have four (4) images or fewer. If there are more than four (4) images, consider placing them in a photo gallery instead.
  • Ensure that each image has compliant alt text.
  • Turn on next/previous images and pagination options.
  • Charts, graphs, maps, images with texts (Complex images) should not be used in slideshows.

Instructions

  1. Navigate to the page with your desired Slideshow Widget
  2. Ensure that Live Edit Is On
    live_edit_is_on.png
  3. Click on the existing Slideshow Widget
    select_slideshow.png
  4. Click Add Images
    add_images.png
  5. Locate your desired images and check the box next to the images
    select_images.png
    • Note: To easily locate an image, you can Search for Display Name or ID. You can still select multiple images at a time, even if you search for different images. The widget will remember all the images you check throughout your search session.
      Search_for_Display_name_or_ID.png
  6. Click Insert Marked
    insert_marked.png
  7. If desired, edit the image Title
    title.png
  8. Edit Advanced options
    advanced_options.png
    • Caption: Add a caption
    • Alt Text: Add alt text
    • Link?: Check to make the image a link
      • Link Address: Add the link
      • Open in new window: Click to open the link in a new window
    • Display: Add a From (start) and End (expire) date
  9. Add as many images as desired
    • Note: Ensure that slideshows have four (4) images or fewer. If there are more than four (4) images, consider placing them in a photo gallery instead.
  10. Configure Options
    Slideshow_Options.png
    • Slide Timing: The number of seconds each image will display
    • Transition: Images can either Fade from one to the next, or Slide to the next
    • Transition Timing: The number of seconds it takes for the fade or slide
    • Slide Title: Check to place a title on each slide
    • Slide Caption: Check to show captions with each image
      Slide_Caption.png
      • Slide Overlay: Displays the title and/or caption in an overlay on each slide
      • Caption Background: Display background for the overlay
      • Caption Location: Determines the location of the caption and overlay
      • Inset Caption: Insets the caption so that it’s not aligned to the border of the slideshow
      • Narrow Display Behavior: Determines how the slide will behave in the narrow view
    • Next/Previous Arrows: Display left and right navigation arrows
      Arrow_Options.png
      • Always show arrows, even when not hovering over slideshow: Click to enable
      • Always show arrows, even on narrow widths (excluding mobile): Click to enable
      • Arrow Color: Color of the arrow
      • Next/Previous Arrow Background: Displays circle background for arrows; check for compliance
      • Arrow Background Color: Determines color of the arrow background color
      • Next/Previous Background: Display a background behind the arrows on the left (previous) and right (next) sides
    • Pagination: Check for compliance
      Pagination.png
      • Pagination Style: Use either Dots or Numbers for the pagination links
    • Randomize Slides: Display slides in a random order
  11. Click Save Slideshow
    Save_Slideshow.png
  12. Click Save at the top of the page
    Save_page.png



I'd Like to Request an Enhancement

0 out of 0 found this helpful

Updated:
Follow

Article Feedback