By continuing to use this site, you agree to the storing of first- and third-party cookies on your device to enhance site navigation; analyze site, product, and service usage; and assist in our marketing and promotional efforts. Cookie Policy

 
Skip to Content

Image Size Sets

An image size set is a group of linked images, identical except for their proportions, for use with responsive or mobile-friendly page designs that require different sizes of the same image to be loaded depending on the layout. A level 10 administrator can create image sizes and image size sets in Setup Image Size Sets.

Image size sets are applied to folders in the access settings. When an image is uploaded to a folder with a size set applied, copies of the image are created according to the specifications of the image size set. These copies then remain linked with the original image, so that they are renamed or copied with it. 

 Image size sets require binary management to be turned on, or else they will not function.

Image SizesLink to this section

Image sizes are the specific dimensions and other options that are applied to the original image to create copies. Each size creates a copy of the original image in the specified dimensions, either cropping it to fit or fitting it to the smaller dimension, and adds a suffix to the file name. 

A popup box titled "Edit Image Size." It has the following fields: Name, value of "Full Width." Suffix, value of "-full." Image Dimensions, with values set for 1600 px by 1200 px. Aspect Ratio, with options for Original (an image of a flower) and Crop (the same image but with only a portion highlighted), and Crop is selected. Two buttons on the bottom read Cancel (gray) and Save (blue).
The above image size, when applied to an example image named example.png, creates a file named example-full.png sized 1600 by 1200 px, cropped to fit.

An image size set is built of individual image sizes, so you must create image sizes before you can make an image size set.

To create a new image size:

  1. Navigate to Setup Image Size Sets.
  2. Enter a name for the image size.
  3. Enter a suffix for the image size. This will be appended onto the name of the original image to make the resized copy
    • E.g., if the suffix is set to "-small," an image named campus.png will have a copy generated named campus-small.png.
    • No two image sizes can have the same suffix. 
  4. Set the image dimensions for the size, width by height. The unit cannot be changed from pixels. The maximum dimensions are 4000 by 4000.
  5. Choose an aspect ratio. 
    • If you select "Original," images will be scaled down to fit the image dimensions without distorting or cropping the image.
      • E.g., if a 400 x 400 px image has an image size of 200 x 300 px applied to it, it will be resized to 200 x 200 px. 
    • If you select "Crop," images will be rescaled to fit the image dimensions and excess cropped from the sides. 
    • Note: In both cases, if an image is smaller than the specified dimensions, it will not be scaled up. Therefore, when uploading an image into a set, make sure it is at least as big as the biggest image size. 
  6. Click Create.

Once created, image sizes can be edited using the same options as above, and deleted. If an image size is edited after it was applied to images, those images will not be affected by the changes. Deleting a size removes it from any image size sets it was included in, but does not affect existing image sets.

Image Size SetsLink to this section

Once you have at least one image size, you can make an image size set. Image size sets are applied to folders; when an image is uploaded into that folder, a copy of that image is made according to each image size. 

Admin Tip: Use an image size set with only one image size and "Keep original image" turned off to enforce a single image size on any uploads to the specified folder. 

To make a new image size set:

  1. Navigate to Setup Image Size Sets.
  2. By default, you view image sizes. Click "Image Size Sets" in the left-hand menu.
  3. Click the green +New button in the upper right-hand corner of the view. The "New Image Size Set" box appears.
    A box titled "New Image Size Set" that contains the following fields: "Name," text field that reads "Standard." "Include original image", with selections for "Yes" or "No." A list of available image sizes that list name, height, width, and whether they crop or not. Two image sizes are selected.
  4. Enter a name for the image size set.
  5. Select whether or not the original image will be included in the group of linked images created by the image size set. If not, the original image will be deleted after the image copies are created.
  6. Select a minimum of one and a maximum of five image sizes from the list.
  7. Select Save.

Hover over an existing image size set to either edit it according to the above options, or delete it. Deleting an image size set removes it from use and any folders it was applied to, but does not affect any existing image sets.

Use and ManagementLink to this section

Assign an image size set to a folder in its access settings (available to level 10 users only). Then, whenever an image is uploaded to that folder, copies of that image are created according to the specified image size set. This works with either "Upload" or "Upload and Edit," but not "Zip Import." The upload may take longer than normal, especially if multiple images are being uploaded. Only .jpg/.jpeg, .png, and static (non-animated) .gif files can be made into image sets. Other file types can be uploaded into the folder without the image size set affecting them. Multiple images can be uploaded at once.

Moving an image from one folder in OU Campus into a folder with an image size set does not create an image set; an upload is necessary.

Once an image set has been created, those images are linked. When one image in the set is copied or renamed, the others are copied or renamed with it; you must confirm this change. When renaming an image set, the extension and suffixes are locked. 

A popup box asking if you are sure you want to copy two files named "aspen-wallpaper-large" and "aspen-wallpaper-medium"

Image size sets cannot be moved. All other actions, such as edit and recycle, affect images individually. If an image in a set is recycled, it is no longer part of that set and is not affected by other file actions, even if restored.

Because images in a set publish individually, make sure to publish all images in a set before using them on your website to avoid accidental broken images. Depending on how your XSL uses the images, dependency manager may not warn you of unpublished images.