Insert, resize and crop images

Using an appropriate number of relevant, high-quality images on your pages makes them more attractive to users. Before you can insert images on individual pages, you must first upload images as described in this how-to. Once the images you want to use have been uploaded to the CMS, follow these steps:

Identify on what page, and where on the page you would like the image to be placed. Go to the page in the CMS, and click the edit tab.

In the main content area, place your cursor in the place you would like to put the image. Select the Insert/Edit image button from the tool bar, it looks like this:

 

 

In the window that pops-up, make sure that the Internal option is selected. Click on the choose file option next to image, and navigate to the image you want to appear on your page. 

In the image description field (alt text)  enter text that describes the image you've uploaded for use with assistive technology.

Apply the img-responsive class if you want the image to respond to varying screen sizes.

The pop-up window should appear as below:

 

 

If you upload an image and decide that it needs to be cropped, flipped, rotated or made a specific dimension, you can make these types of minor alterations from within the CMS.

Click the image you want to alter from the site tree and select Edit.

You will now see the options to change the dimensions of the image, rotate the image clockwise or counterclockwise, flip the image vertically or horizontally, and crop the image.

 

 

Be sure to keep the Maintain Aspect Ratio option locked to warp your photo when resizing.

 

View our recommended template image sizes to see image size requirements.