Slideshow

This page describes for web editors in the School of Pharmacy how to work with slideshows in a website built by the Office of Communications.

  • A slideshow enables you to display multiple images one at a time within the same area of a page, and it is distinct from a Gallery.

  • Slideshows are available only to sites on pharm.ucsf.edu.

  • Only one slideshow per page is permitted.

  • The slideshow appears only at the top of the page.

On this page

When should I use it?

Slideshows work best when you want to give visitors a visual first impression consisting of multiple images. Remember, however, that visitors are usually visiting your site to find other info, so they might see the first image, but the odds they will see the second or third or fourth decrease significantly since they likely have scrolled or clicked away from the page before then. Although there is no limit to the number of images you can add, attention spans are short on the web. Keep it reasonable.

Create a slideshow

  1. Edit the page to which you want to add the slideshow. Or, create a new page: in the dark gray menu bar at the top of the page, select Content > Add Content > Basic Page.
  2. In the Slideshow section, upload one image. After the image is uploaded, a cropping interface appears.
  3. Crop the image as you desire, then select the Save button. The cropping interface disappears, and an image thumbnail appears in the slideshow section.

  4. Required: add alternative text, as described in Required: create alternative text for screen reader users.

  5. Repeat steps 2 through 4 as desired.

  6. Optional: reorder an image by dragging the grab handle at the top left corner of the image thumbnail.

  7. If in step 1 you created a new page, find the Domain-specific paths section, then set a domain-specific path which represents the web address (URL) to this page.

  8. Select the Save button at the bottom of the page. The draft page loads, and your slideshow should be visible and functioning.
  9. Review the slideshow, making changes if needed.
  10. Select the Apply button to publish the page.

Change a slideshow

Changing items in a slideshow should be obvious once you edit the page. If needed, review how to create a slideshow, or contact us at Website and Communications Support.

Remove a slideshow

  • To remove an image from a slideshow, edit the page, then select that image’s Remove button.
  • To remove the entire slideshow, select the Remove button for each of the images.

Examples