Editing the Slideshow - Current Template

If your PrismWeb site has a slideshow, you will want to update it from time-to-time, to show new information and pictures.  You can add new slides or update the existing ones by adding new images and editing the code for the slideshow.
Tip:  For a slideshow to be effective, it should only contain up to 5 slides, with the most important slides at the beginning and least important ones at the end. 

About the Slideshow Code

Slideshow code is located in the outerweb folder, and the code to customize the slideshow can be found in the slideshow.asp file.  The slide images are located in the Images folder.

There are two main components to the slideshow.asp code: images and captions. 

Images and Captions are listed in the order that they appear in the slideshow.  By default, each image is also a link. You can delete the <a> tag from around the <img> tag to remove the link.

Editing Existing Slides

  1. Upload a new slide image to the Images folder.
    Note:  All slide images should be the same size.  The size of your slideshow image will be in the code comments in the slideshow.asp file.

  2. In the Outerweb folder, double-click the slideshow.asp file to edit it.

  3. Decide what position in the slideshow you want the image to appear, and find the appropriate <img> tag for that position in the code.

  4. Change the path (src attribute) of the current slide image to the path of the new image, e.g., images/new_image.jpg.

  5. Change the alt attribute of the <img> tag to provide a short description of the new image.

  6. If you want to make the new image a link to a page, edit the href attribute of the <a> tag that wraps around the <img> tag.

  7. Find the matching caption for the slide you edited.

  8. Edit the caption text, between the <span class=”captions”> tag and the </span> tag.

  9. Save the file.

  10. Verify that the new slide image, caption text, and link are working correctly by opening the homepage of your staging site in your browser.   
    Note:  If you already have the page open in your web browser, you will need to refresh the page in your browser. 

Adding New Slides

  1. Upload a new slide image to the Images folder.
    Note:  All slide images should be the same size.  The size of your slideshow image will be in the code comments in the slideshow.asp file for the correct dimensions.

  2. In the Outerweb folder, double-click the slideshow.asp file to edit it.

  3. Decide where in the slide order you would like the new slide to be placed.  Highlight and copy the code for one of the existing slide images.

  4. Paste the copied code where you would like the new slide image to be located.

  5. Change the commented slide name, e.g., SLIDE 1 to SLIDE 4

  6. Change the path (src attribute) of the copied slide image to the path of the new image, e.g., images/new_image.jpg.

  7. Change the alt attribute of the <img> tag to provide a short description of the new image.

  8. If you want to make the new image a link to a page, edit the href attribute of the <a> tag that wraps around the <img> tag.

  9. Edit the caption for the new image and link.

  10. Save the file.

  11. Verify that the new slide image, caption text, and links are working correctly by opening the homepage of your staging site in your browser.   
    Note:  If you already have the page open in your web browser, you will need to refresh the page in your browser. 

 

First Published 06/24/2020

Edited 06/24/2020

© 2020 Nebraska Book Company, Inc.  All rights reserved.