Add an Image to Your Portfolio Page

Help Center Portfolio Help Center Add an Image to Your Portfolio Page

You can use HTML to add images, such as pictures of yourself and your friends, to your portfolio. First, the images need to be uploaded to a Web server, and then you can add them to your portfolio.

Upload the Image

To save the image to a Web server, you can use the Catalyst SimpleSite tool, and follow these steps:

  1. To access SimpleSite, open a Web browser and go to http://catalyst.washington.edu.
  2. Click Web Tools Login. You will be prompted to enter your UW NetID and password.
  3. If this is your first time using Catalyst tools, you may be asked to enter in some information for your profile. Once you have finished, click SimpleSite on the menu on the left.
  4. You will move to the SimpleSite main menu. Select your Web site from the "Available Web sites" drop-down menu, and then click Next. You will move to the SimpleSite workspace.
  5. Click Upload file at the top of the page. The “Upload a file” dialog will appear.
  6. Click Browse, and the “Choose file” dialog box appears.
  7. Locate the image you want to upload from your computer, select it, and click Open.
  8. The default location to save the image on your Web site and file name should be okay, so click Next to upload your file.
  9. The page will change to a file summary for the newly uploaded image. You will need to know where the image is saved in order to include it in your portfolio. To copy the URL, highlight the URL of the image, and then select Edit>Copy from the browser menu bar.

Add the Image to Your Portfolio

Now that you have saved the image to you will need to add the image to a section in your portfolio.
  1. While editing a page, locate the section to which you want to add the image and make sure the ”Display as HTML” option is selected.
  2. Insert this HTML code where you would like the image to appear:
  3. <img src=”URL”> where URL is the address of your image. You can paste the URL you copied by selecting Edit>Paste from the Web browser’s menu.

    Example: <img src=”http://www.images.com/image”>

  4. Click Preview to view the image on your page.