Resizing Images for WordPress

Adding images is a great way to spruce up web content.  Images can help to describe your content, support a point, and allow the reader to better envision what you are talking about!

Most modern cameras take photos that are far too large to upload to the web – including very large images on web pages can be a problem for your users.  A user on a mobile device may have difficulties downloading your very large file image.

There are many tools available that will help you to resize photos for the web.  PhotoshopPicasa, and Apple Photos are all great tools that you can use to resize your photos.

If you do not have any of these tools, you can utilize an online tool called Pixlr to resize your images.  Follow the instructions below to learn how to use this tool.

  1. Visit Pixlr Express (https://pixlr.com/express/)
  2. Click Browse.  You will be prompted to select your image from your computer.
  3. When your image has opened, click “Adjustments”, and then “Resize”
    pixlr-instructions-resize
  4. In the Resize Options, set the width to a maximum of 1200.  Leave the “Keep Proportions” option selected.  Then click Apply.
    pixlr-instructions-resize2
  5. Click Save to save your image.  You should save your image with a new name (so you do not overwrite your original image!).  You should leave the quality set at 85.

Once you have resized your image, you are ready to use it on your website!

How To: Upload an Image into Cascade

Cascade is one of the content management systems used at Saint Joseph’s University.  Users have access to this system to create and manage in-depth information about departments and offices at the University.  This is the first of a series of how-to articles that will assist users of the Cascade system in creating and managing their content.

Upload an Image into Cascade

Before you can use an image in your webpage, you must upload it to the Cascade system.  Before we get started, make sure that the image is on your computer.  If you have the image in a word document, in your email, or on a website, you must download the image to your computer.  Remember where you have saved the image.

Log in to Cascade (http://www.sju.edu/webedit).

Creating a folder named “images”:

  • Click on the main folder of your website.
  • Select New > Folder
    cascade-uploadimage-newfolder
  • In the System Name field name the folder “images”.
  • Do not change the Parent Folder field.
  • Do not change the Metadata Set field.
  • Leave the Publish box checked.  We want to publish this folder so that it and files within it can be seen outside of the system.
  • Uncheck the Index – Include when indexing box.  We do not want to include this in the menu index on the website.

Upload Your Image

  • Choose the folder you would like to upload your image to.  You can use the images folder in your website to help keep files organized.
  • Select New / File
    cascade-uploadimage-newfile
  • Leave the System Name field blank.
  • Leave the Parent Folder field as-is.
  • Leave the File Contents field blank.
  • Under the Data section, select Browse or Choose File to locate the image to upload.
    cascade-uploadimage-upload
  • Locate the image on your computer.
  • Click on the Submit button.
  • Your image is now uploaded to Cascade.