Insert images

How to insert images on intranet pages

Use these instructions to insert images such as photos or diagrams on your intranet pages. It's a breeze to add images to your page using image files (JPGs, PNGs, GIFs, etc.) from your computer. You can also add images that are already uploaded to the intranet in recommended or regular galleries, or import free professional images from Unsplash.

Images really spruce up a page and are particularly attractive on news and blog posts where they'll draw in and engage readers. You can easily crop or resize images and set them to align on the left or right of the text on your page.

The first image that you insert on a page will automatically become the thumbnail image on the page. The thumbnail image may be used to represent the page in search results, news items, page shares and certain navigation or directory areas. To learn about the thumbnail image, including how to change and crop it, see How to add a Thumbnail image.

To learn about adding other kinds of images, see Add page header images, Add profile photo and Add profile cover photo.

Drag and drop images

Images can be drag-and-dropped, or copied and pasted, directly into the Rich Text Editor window in edit mode, without clicking on the Insert Image button. Multiple images can even be drag-and-dropped into the Rich Text Editor in one move.

As different browsers may function differently, please see the points below for supported functionality:

• Drag-and-dropping for both single and multiple images works in all supported desktop browsers.
• Pasting images from your computer's clipboard works in all supported desktop computers. Pasting images that have a large file size may cause performance issues.
• Copy and pasting image files from your computer's desktop environment (ie. the desktop or file explorer) works in Firefox and Edge.

Use the Insert Image button to browse for image files

1. Click the Edit button (pencil icon) in the page header to enter edit mode. 
2. In the content box, set your cursor where you want to insert the image. 
3. Click the Insert Image button to bring up the images pop-up window.
   
   
    
4. To add an image, do one of the following:
   • Drag and drop images onto the window.
   • Click on Upload Images at the top, or click on the camera icon in the window.
   • Click on the Unsplash tab (and see Insert images from Unsplash for more details).
   • Click on one of the displayed galleries, and select an image from the gallery.
     
     
     
     
5. If you choose the second option in step 4, browse to the image you want, click once on the photo file and then click Open in your file browsing window to upload it.
6. Your image will show in the window. Click the Insert button and you will now see the image sitting on your page.
7. Continue editing or click Save at the top of the page.

Crop image

After you insert an image into the Rich Text Editor, you can crop the image by using crop presets, or by selecting the specific size and area of the image that you want. Image crop is not available for images inserted using the Insert web image feature.

1. In edit mode, select the image to bring up the image menu.
   
   
   
   
2. Click the edit icon (Image properties) in the image menu. The Image properties pop-up window will open.
   
   
   
   
3. To crop the image to the area you want to show, you can:
   • Select one of the five available crop presets: 1:1, 3:2, 2:3, 4:3, 16:9.
   • Click and drag the edges or corners to change the size or shape of the crop area.
   • Click and drag the image to select what is in the crop area.
   • Click Reset to change the crop back to the complete original image.
4. Click Update.
5. Continue editing or click Save at the top of the page.

Image search and galleries

When you insert an image on a page, one of the options in the Choose Image pop-up window is to select an image from a gallery that exists on the intranet. You can also use the search feature in the Choose Image window to find an image that is in a gallery or in a document library.

Your intranet administrator can set certain galleries as Recommended galleries that will appear above All galleries in the Choose Image window. Galleries that you have Bookmarked will appear with a star beside the title at the top of both the Recommended galleries and the All galleries sections.

To choose an image from a gallery, click once on the gallery thumbnail image to display all of the images in that gallery. Then click on an image and it will load into the Page images section of the Choose Image window. Click the Insert button to insert the image on the page.

If you don't find what you want in a gallery, click the back arrow on the top left of the Choose Image window to go back to viewing all of the galleries.

You can sort the All galleries section by Title or Date by clicking on the Sort by option on the right of All galleries.

To search for an image, enter your search term in the Search box at the top of the Choose Image window. Galleries and individual images from galleries or document libraries will be filtered according to your search term. When you find the image you want, click on it to select it and then click the Insert button to insert the image on the page.

Insert image from the web

In addition to inserting images from files on your computer you can insert images from websites.

1. Click the Edit button (pencil icon) in the page header to enter edit mode.
2. Go to the website with the image you want to insert. Copy the URL for the image.
3. Back on the intranet, in the content box, set your cursor where you want to insert the image.
4. Click the Insert web image button to bring up the Web image pop-up window.
   
   
    
5. Paste the URL in the Enter image URL field in the Web image pop-up window.
   
   
    
6. A preview of the image will show in the Web image pop-up window. Click the Insert button and you will now see the image sitting on your page.
7. Continue editing or click Save at the top of the page.

Choose how image interacts with text

When you insert an image in text it breaks the text, sitting on the left of its own line with the text above and below it. You can set an image to display in line anywhere in the text, or to float on either the right or left side of the page with the text wrapping around it.

In edit mode, click on the image to display the image menu. The three icons on the left of the image menu control how the image interacts with text. From the left the settings are In line, Wrap text, and Break text. Click on the icon to choose that setting. Click on the arrow to the right of Wrap text or Break text to choose whether you want the image to float left or right, or be centered. After choosing your image setting, you can click and drag the image on the page to change its location.

Image menu:

Break text

Image sits on its own line with text above and below. The image can be centered or set to align on the left or right of the page. Break text with a centered image is the default setting.

Wrap text

Image floats on the left or right with text wrapping around it.

In line

Image can be placed anywhere in the text and displays in line with text.

Add image caption

Add a caption to describe or provide more context for an image. Captions can be added to images with the wrap text or break text style selected. (See Choose how image interacts with text heading above.) If the inline image style is selected, captions will turn off. If the inline image style is selected, and captions are toggled in, the image style will switch to break text style.

1. In edit mode, click once on the photo to select it and bring up the image menu.
2. Click the Toggle caption on icon in the image menu.
   
   
   
   
3. Type the image caption in the caption field that appears below the image.
   
   
   
   
4. Continue editing or click Save at the top of the page.
   
   

Re-size an image

You can make an image larger or smaller so it fits just right on the page.

1. In edit mode, click once on the photo to select it and bring up the image menu.
2. You can resize images in one of three ways:
   • Click and drag any of the tiny boxes in the corners of the image to make it smaller or larger.
     
     
     
     
   • Click on the Resize image icon in the image menu and select one of the preset resizing percentages from the menu that opens.
     
      
   • Click on the pencil icon in the image menu. The Image properties pop-up window will open. Type the Dimensions that you want in the corresponding fields. Aspect ratio is maintained, so that when you change one dimension the other dimension automatically updates to maintain the same width to height ratio. Click Update.
     
     
     
     
     
3. Continue editing or click Save at the top of the page.

To return an image to it's original image size, click on the image to bring up the image menu, and click Reset to original size.

Remove & delete images from the page

You can remove an image from showing on the page as well as completely delete an image from the page. When you simply remove an image it still is available to be inserted on the page again. The instructions below explain both how to remove an image and how to delete it from the page.

1. (Remove) In edit mode, click once on the photo and type Delete or Backspace on your keyboard. The photo will disappear from the page.
2. (Delete) Click on the Insert Image button in the content toolbar to bring up the Choose Image pop-up window.
   
   
   
   
3. (Delete) Hover over the image you want to delete, and click the garbage can icon in the bottom right. The thumbnail will disappear and the image will no longer be available to insert on the page.   
   
   
    
4. Click Close in the bottom right of the Choose image window.
5. Continue editing or click Save at the top of the page.

Note that if an image is the Thumbnail image for the page, removing the image from the page will not remove it as the Thumbnail image. However, deleting the image will remove it as the Thumbnail image for the page. To learn more see the how to add a Thumbnail image.

Delete an image from a photo gallery

Images on photo gallery pages are just attached files that are displayed in a different way than on other page types. So deleting an image in a photo gallery is different from deleting an image on a page. To delete an image from a photo gallery:

1. Go to the photo gallery page.
2. Click Gallery tools above the photos. A set of gallery actions will appear above the photo gallery.
3. Select the image(s) you want to delete.
4. Click Delete in the gallery actions above the photo gallery.
   
   
   
   
5. Click Delete in the pop-up window to confirm the deletion.

Learn more:

• Images and videos
• Insert images from Unsplash
• Add page header image
• Add thumbnail image
• Add a profile photo
• Add a profile cover photo