Embedding Images in Formatted Text Blocks

How to embed and format images in Formatted Text Blocks

Prerequisites

This tutorial assumes you already know the following:

Step 1: Image Placement

  1. When in the Formatted Text Block editor, place your cursor in the location you would like the image to appear.
  2. Click on the image icon in the toolbar.

Toolbar Image Icon

Step 2: Choose the Image

Image

  1. If you have already uploaded your image, press Choose. Otherwise, press New and upload your image.
  2. You now need to search for your image in the Image Gallery.
    1. Enter the image's title or keywords.
    2. Choose a subsite to search in (if you aren't sure, choose "/" and check "Include Child Subsites" to search the whole site).
  3. Once you have made your filtering decisions, press Search.
  4. Browse through the results, and click on the image you want to use.
  5. Click on Use Highlighted Image.

Image Size

Here you can resize the image and give it padding. Note that if you resize the image here, it will squish or stretch the image, which might not look very good. We recommend that you resize the image before uploading it.

Edit image size & padding

  1. Press Edit.
  2. Original Size: Displays the image at the size it was when it was uploaded.
  3. Scaled: Resizes the image based the height and width you provide (in pixels).
    1. Scale Proportionally: Keeps the original proportions (so if you change the height, it will figure out the correct width). We recommend you keep this checked.
  4. Spacing Around Image: This adds padding, or space, around the image.
    1. Vertical: Padding on the top and bottom.
    2. Horizontal: Padding on the right and left sides.
  5. Press OK to submit your changes.

Image Alignment

If you would like to have text wrap around your image, you need to change the alignment.

Image alignment

Selecting "Left" will have the image on the left and the text wrapping to the right.

Alternate Image Text (Flyover Text)

Alternate image text is printed in place of your image for people with visual disabilities who are using screen readers.

  1. Enter a brief description of the image.

Link

Button to edit the image's link

  1. If you would like to make this image a link, press Edit.
  2. To link to a page within our site, or an external page, select Link to Existing Page, Uploaded Document or URL.
  3. Press Next.
  4. If this is a CommonSpot page, select CommonSpot Page, Uploaded Document or External URL and press Page Gallery.
    1. Choose the subsite the page you want to link to resides in.
    2. If you don't see the page you are looking for, change the Category to All Categories.
    3. Click Update Results.
    4. Click on the page you want to link to.
    5. Press OK.
  5. If this is an external page, select External URL or Relative Internal URL.
    1. Paste in the full URL to the page.
  6. Press Finish.

Finish Inserting the Image

  1. When you are satisfied with your choice, press Finish.

Was this page helpful?      



Comments are helpful!
500 character limit

Feedback is anonymous.