Images
Images are added to a page using the Image block. To add the image block to page, follow these steps:
Create a new placeholder for a block. The placeholder text (“Type / to choose a block”) is displayed.
Enter /image in the placeholder. A list of block options is displayed.
Select the second Image block from the list (it is labelled in blue – do not use the Image block with a black label). The Image block is added to the page.
Select a method for placing the image on the page. Upload and Media Library are the most commonly used methods.
If you have not yet uploaded the image to the website, click Upload to open your computer’s file explorer. You can then navigate to the image’s location on your computer and upload the image.
If you have already uploaded the image to the website, you do not need to upload it again. Instead, click Media Library to display the media library in a window. Use the Search field to locate your image; once you have located it, click on the image then click Select in the bottom-right corner to place it on the page.
The image is displayed in the Image block on the page after it has been uploaded or selected from the Media Library. It can now realigned or resized.
Image Alignment
Images can be left-aligned, center-aligned, or right-aligned. While an image is selected, click the Align icon in the toolbar (see image below), then select the desired alignment.
Resizing an Image
To re-size an image, click and drag the circles on the image’s borders and drag the image until it is the desired size.
Note: An image may lose quality if it is resized to a resolution larger than its original size. Contact the Web Team if you are uncertain about image quality.
Alt Text for Images
Alt Text, or alternative text, is text that describes what is happening in an image. This text is utilized by screen readers that is read to visually-impaired website visitors for enhanced accessibility.
An image’s alt text is entered in the Alt Text field in the block menu when the image is selected. When writing alt text, enter a literal description of what is in the image. In the example below, the image has an alt text that reads: A female student and three male students in business attire look at two laptops on their table during a group assignment.
Deleting an Image
To delete an image, click the Options icon in the toolbar (the rightmost icon with three dots), then click Delete. The Image block containing the image is removed from the page.
Note: The deleted image is still available to reuse in the Media Library and does not need to be uploaded again.
Replacing an Image
You can replace an image with another one without having to delete its Image block and create a new one. To replace an image with another, follow these steps:
While the original image is selected, click Replace in the toolbar. A menu is displayed with replacement options.
Select either Open Media Library or Upload in the menu.
If you have not yet uploaded the image to the website, click Upload to open your computer’s file explorer. You can then navigate to the image’s location on your computer and upload the image.
If you have already uploaded the image to the website, you do not need to upload it again. Instead, click Media Library to display the media library in a window. Use the Search field to locate your image; once you have located it, click on the image then click Select in the bottom-right corner to place it on the page.
The new image is placed on the page in the same location as the image it replaced. You can now format it with the desired sizing and alignment.