Uploading Pictures

Photos are an integral part of the Student Affairs website. In addition to serving as useful illustrations, photos also make a page more readable and appealing for the user.

Before you use the Online Editor Tool, you'll want to review our photo guidelines to make sure the photos you upload are appropriate for the site. We generally use smaller photos that fit within the framework of our template. If you visit some pages within the Student Affairs site, you will get a sense of appropriate use and sizes. Most photos that appear in the main content area of our web pages are about 180-200 pixels wide. For help on re-sizing your photos prior to uploading, please see Resizing and Cropping Photos Using Microsoft Paint.

If your photo is resized and ready for upload, use the Online Editing Tool to upload your photo to your website and attach it to a web page.

Uploading a Picture
  1. Login to the Editing Tool. From the list of menu items near Edit: MainContent in the bottom right-hand corner of the page, choose Upload: Picture.
  2. On the new page that appears, read through all of the introductory text, which will help guide you. Look for an option for Upload in the middle of the page. Click on the Select button that appears in light gray. Navigate to the drive/folder where your photo is stored and click Open. Your filename will now appear next to the Select button.
  3. Next to File Name enter a one-word name for the file. The tool may not automatically accept the default name, so re-enter the name just to be safe. Make sure the filename is unique, or you might accidentally overwrite another picture by that name in the directory. Exclude the extension (such as .jpg or .gif), and name the file with no uppercase letters.
  4. Next to Picture Format, please use the default option Don't Change. This assumes that you have already saved your file with the correct format.
  5. Next to Picture Width, please use the default option Do Not Resize.
  6. Click Upload Picture to complete this task.
Adding Your Uploaded Picture to a Page on Your Site
Image Manager Icon

Now that you have followed the instructions above, you're ready to add your photo to a web page. Make sure your page has been proofed and is ready to go before you add the photo.

Navigate to the page on your site where you want to add your photo. With the page in front of you, follow these instructions:

  1. Click on Edit: Main Content to open your page in the editing window.
  2. Click at the beginning of a paragraph anywhere on your page. This insertion point is where your picture will appear before you apply the align right or align left options.
  3. In the second row of tools, select the Image Manager tool. Once you click on that icon, the file that you added in the step above will automatically appear in the middle section of your window along with other photos that may have been previously added.
  4. Click on the image filename. Notice that the picture you selected appears in the right-hand window. Before you click insert, you will need to modify the properties of your photo by clicking on the Properties button.
  5. Next to the field for Alt Text, type a short, accurate and helpful description of the photo. This helps our visually-impaired users and may appear when you mouse-over an image on the finished page.
  6. Click OK to insert the photo.
  7. If you want the image to appear on the right or left of your finished page, click the photo and choose an option from the Format drop-down menu. Choose Photo Float Right or Photo Float Left to position the photo to the right or left of the page. (Other CSS Class options in that menu are not applicable to photos, so the float right and float left options are the only choices you can select.) To save the page and confirm your changes, scroll to the bottom of your page and click on the Save Changes button.