Elements: Images

How to add, resize, move, and modify images on your website pages

You can easily add pictures, graphics, and photos to any page on your Streamline site. We make it easy to resize and move these images as well.

All major image types (.jpg, .gif, .png, .tif, etc.) are supported.

Add images to pages

  1. Navigate to the page and click Edit this page at the top right of the screen:  editpage
  2. Below the Title, in in the Main Body Content area, locate the + icon  to the left of the location where you want to add an image, and click the icon to bring up the Insert Element menu (if you don't see these icons, simply click to the left, outside of the Main Body Content area, to make them appear)
  3. Choose the Image element and click Insert in the top-right corner:
  4. Locate the image from your Content Library and click on it to select it. If you don't see the image you're looking for, you can either:
    1. Upload an image by clicking Upload from your computer
    2. Use one of our free stock photos by clicking Select from stock photography
  5. Once you have the image selected, click the Select button in the top-right corner:

See how:

Resize images

  1. While editing a page, hover your mouse cursor over the image
  2. Locate the blue up-down arrow icon    on the bottom or side edge of the image
  3. Click, hold, and drag the arrow to resize the image as desired

See how:

Move images

  1. While editing a page, hover your mouse cursor over the image
  2. Locate the blue cross icon  near the top-right corner of the image
  3. Click, hold, and drag your mouse to reposition the image

See how:

Note: images will try to fill the center of the page by default, but you can align them to the left or right of the content, and any text on the page will wrap around the image naturally!

Remove images

  1. While editing a page, hover your mouse cursor over the image element
  2. Locate the red X icon    near the top-right corner of the image
  3. Click the X to remove the image from the page

See how:

Note: This only removes the image from this page, and does not remove it from your Content Library!

Edit alt-text for images

  1. Hover your mouse cursor over the image
  2. Locate the gray bar near the bottom of the image labeled Alt-text  
  3. Click anywhere on the gray bar to bring up the alt-text edit screen
  4. Add/modify your alt-text and when finished, click Save:  

See how:

Note: Alt-text, or alternative text, does not visually appear on the page - it is what a screen reader or other assistive device will read to a non-sighted visitor, and it's very important that all of your images have alt-text to ensure your site is accessible.

Edit captions for images

  1. Locate the italicized gray text underneath the image 
  2. Click on it and type a caption
  3. Click Done to confirm your changes:

See how:

 

 

Related Keywords: picture, image, photo, gif, jpg, jpeg