images

UC Slideshow

Note: If you’re using Hale 2015, Sherman, or any other Cornerstone based theme, use Meta Slider instead of UC Slideshow.

UC Slideshow is a custom widget developed by UITS to create basic image slideshows for your homepage.

Setup

slideshow-setup-1

  • Log in and go to Appearance > Widgets.
  • Drag UC Slideshow into one of the Home sections.
  • Click the Save button.

Using UC Slideshow

Use the Add Images button to select up to 5 images from your media library. If you haven’t yet added the images to your media library, cancel. Look for Media > Add in the main system navigation, upload your images, and then return to Add Images.

Text

If you’d like text to appear with the image, fill in the ‘Caption‘ field.

Links

To add a link, paste a web address into the ‘UCS Link‘ field, and the entire image will be clickable. For example: http://aurora.uconn.edu/

Ordering

To change the order of the slides, click and drag the thumbnails along the bottom of the window.

Removing Slides

As you select an image, you’ll see a checkmark appear in the top right corner of the thumbnail. To remove the slide, click the checkmark again.

Additional Features

slideshow-setup-2

Effect

Choose what kind of animated transition will occur in between the slides.

Speed

This determines how much time each slide will remain on the screen before moving to the next.

Theme

This will influence how the display controls will look.

Formatting Your Images

If you don’t crop your images, they may not fit quite right into your slideshow.

Depending on which section you place your slideshow in, the maximum width and height will change. If you want a simple rule, just clip your images to the ‘Full Width’ measurements below. That will also give you the greatest degree of flexibility in deciding where to place things.

Homepage Column Type Width (px) Height (px)
Full Width* 1170 456
Two-Thirds width 770 300
Half width 570 221
Third width 370 144
Quarter width 270 105

* If you save it at this size, it will size down correctly to any of the other configurations. If you’re not sure what layout you want to use, sizing your photos to these dimensions is a good option.

Meta Slider

Meta Slider is the primary slideshow tool for Aurora. It can be accessed from the left-hand menu on your dashboard.

To add a new slider, click the + tab at the top of the screen. You can then rename your slider by clicking directly on its tab.

   

Then, simply click the Add Slide button to start adding slides!

 

Types of Slides

On the left-hand side of the Add Slide window, there is a menu with different types of slides that can be added to a Meta Slider. Below is a description of each.

Image

The most common type of slide is an Image slide. For this slide the user must either choose an image from their Media Library or upload a new image.
 

External URL

This slide type is used if the user wants to embed an image located elsewhere on the web. To use this slide type, the user must click Add to slider before they can insert the image URL.
 

Layer Slide

To create an image slide with layers, such as text, links, and more, add a Layer Slide. Like the Image slide type, the user must either select an image from the Media Library or upload one. Once the slide is added to the slider, the user can click ‘Launch Layer Editor’ under the General tab of the slide in order to add/edit layers. The above image shows the layer edit screen.

For more information, view the layer slides guide on the Meta Slider official website.

Vimeo/YouTube

Both Vimeo and YouTube are sites that host videos. For both of these slide types, the user must add a video URL from Vimeo or YouTube, respectively, and that video will be embedded into the slide.
 

Post Feed

This slide type embeds posts into the slider. Like the External URL slide type, the user must click Add to slider before they can choose which posts are displayed.

Under the slide's Display Settings tab users can choose how many posts will be displayed (Post Limit), and each post displayed will have its own slide. Through Display Settings users can also choose how the posts are ordered. If the user only wants posts of a certain category, the user may choose this under the slide's Taxonomy tab. Only posts with a Featured Image can be displayed.

Common Settings

There are many settings through which a user can customize their slideshow. Here is a breakdown of some of the more commonly utilized options available:

  • Navigation — Users can opt to have different types of navigation displayed below their slider to make it easier for viewers to get to a specific slide. However, there is also the option to hide the navigation altogether, which may be a better option for a slideshow consisting only of images. Users can also opt to display left and right arrows on their slider as navigation.
  • Slide delay — Located in the Advanced Settings, the slide delay determines how long each slide is shown before moving onto the next. If any slides have captions, users should be aware how long it takes to read these captions and alter the delay speed accordingly.
  • Stretch — The Flex, R., and Nivo sliders all have the option under Advanced Settings of 100% wide output. If this box is checked, it means that the slider will grow to fit the space it is in if necessary, even if the space is wider than its set width.

Types of Sliders

There are four types of sliders that you can choose from: Flex, R., Nivo, and Coin. Each slider has a slightly different feel to it and some of the settings vary from slider to slider. The best way to determine which slider is right for a specific slideshow is to try them all out! Users can easily preview a slideshow without adding it to a Page or Post by clicking the Save & Preview button at the top right of the slideshow's edit screen. Below are examples of each slideshow type.

Flex Slider

  • Great Lakes and Central U.S. Viewed From the International Space Station
    Great Lakes and Central U.S. Viewed From the International Space Station

Nivo Slider

Aurora 1 Aurora 2 Aurora 3

R. Slider

  • Antennae Galaxies
    Antennae Galaxies
  • Aurora at UITS
    Aurora at UITS
  • Great Lakes and Central U.S. Viewed From the International Space Station
    Great Lakes and Central U.S. Viewed From the International Space Station
  • Sunset Over the Gulf of Mexico
    Sunset Over the Gulf of Mexico
  • Aurora Borealis
    Aurora Borealis
  • Sunrise From the International Space Station
    Sunrise From the International Space Station
  • Space
    Space

Coin Slider

Images

Finding Images

Don't just search Google Images and grab something. Make sure you are using something you paid for, something you shot, or something from the public domain. You run the risk of getting yourself, your department, and the university in trouble. Read more: Copyright, Fair Use.

Some useful websites to check:

Prepare Images Before Uploading to Aurora

If you don't have access to Photoshop, try using the following free software to edit images.

Tips for Saving Space

Each website on Aurora comes with a 1 GB storage limit and a file size limit of 100 MB. If your site has a lot of images or other media, you might find some of the below tips for saving space useful.

Edit Images Before Uploading

If you edit images in Worpdress, it appears as if you’ve done the correct thing of resizing and cropping the image down. However, the WordPress image editor is non-destructive, which means it keeps the original in the Media Library, and then creates a duplicate for the new edited version. Instead, try one of the following software to reduce the image size:

  • GIMP
  • Fotor
  • Photoshop (Go to Image > Image Size, and choose a resolution of 72px, and if your width is larger than 1200px, you’ll want to reduce that as well. Then, use the File > Save for Web… option to compress the image into a JPG. This process can compress a print quality image by as much as 99%.)

Export Screen Versions of PDFs

Adobe Acrobat Pro, which is free to all UConn students, faculty, and staff starting in fall 2015 with Skybox, allows you compress the size of a PDF.

Go to File > Save as Other… > Reduced Size PDF.

Export Screen Versions of Office Documents

Programs like Word and Powerpoint have options for saving smaller versions of the original document.

ZIP Files

If you have a large number of files that people will commonly want to access together, you can bundle and compress them into a single ZIP file for additional storage saving.

Off-Site Storage

For sites with truly massive storage needs, it may be necessary to keep files on another web server and link to them. When inserting an image or linking to a document, rather then browsing the Media Library, you would just enter the URL of the file on the other server. If you require this setup, contact webdev@uconn.edu about obtaining an account.

Video Tutorials