9F84B98E-DE6E-5F58-940F3FFD6A2FC067
D8E516AE-D96E-BE49-6F91C062272838E7

Slideshow Options


There are several options for slideshows: inplace scrolling, single and multiple. Below are examples of each, as well as links to pages on the Hamilton site. If you need help deciding which option to use, contact Esena Jackson or Cathy Brown in Creative Services.

Inplace scrolling

  • Images appear within the page and forward/back arrows and image numbers can be used to navigate between the images.
  • The images can either load in a specific order or randomly.
  • The slideshow can play automatically according to a duration of time you set.
  • You can specify a link for each image.

When you choose inplace scrolling, it's best to crop all the images to the same size. For slideshows that take up 2/3 of the center column, crop images to 467 pixels wide and 350 pixels in height. For full-width slideshow, the maximum width is 709 pixels. You can choose the approriate image height, but it's best to be consistent and crop all images to the same dimensions. (See module dimensions: 2-Column Template, 3-Column Template)

In the examples below, the alumni home page slideshow is 709 x 240 and the Arbor Day slideshow is set to large (500 pixels wide).

Webpages: Academic homeAlumni home, Parents home,  Reunions '14World-View PhotosTen Things You Should Know About Hamilton

Please Edit to add slideshow images

prev next

Please Edit to add slideshow images

prev next

Single

A single image is linked to a larger version in a "lightbox" slideshow that overlays the content on the page. There is no need to crop images to the same size, but as a general rule, it's best to set a maximum width/height to 800 pixels. This slideshow also has the option to display a different image at random when the page loads.

Please Edit to add slideshow images

Please Edit to add slideshow images

Please Edit to add slideshow images

Multiple

Choose a muliple slideshow if you want all the images to appear on the page at the same time. It is best to crop images to the same size. When you click on the image, the larger version of the image appears on the page in the same manner as the single image.

Web pages: Great Names, Alumni Review - Previous Issues, Student Life - Where to Live

Small Image Size

Please Edit to add slideshow images

medium image size

Please Edit to add slideshow images

Back to Top