How to Add and Resize Images in SiteJet

Images bring your website to life. SiteJet makes it straightforward to add images from your library and resize or reposition them to fit your layout perfectly.

Adding an Image to Your Page

There are two common ways to add images in SiteJet:

Method 1: Replace a Template Image

1. Click on any existing image on the canvas to select it
2. Look for the Replace Image or Change Image option in the sidebar or context menu
3. Choose an image from your media library or upload a new one

Method 2: Drag in a New Image Element

1. Open the left sidebar and find the Image element
2. Drag the image element onto the canvas and drop it where you want it
3. Click Select Image to choose a photo from your library or upload one

Resizing an Image

Once an image is placed on the canvas:

• Click the image to select it - you'll see resize handles appear around it
• Drag any handle to make the image larger or smaller
• Hold Shift while dragging to maintain the original aspect ratio

Adjusting Image Position and Fit

With an image selected, the right panel or toolbar gives you options to control:

• Object fit - Choose whether the image covers, contains, or fills its container
• Alignment - Position the image left, center, or right within its element
• Padding and margins - Add space around the image

Best Practices for Website Images

• Use images that are optimized for the web (JPEG or WebP for photos, PNG for logos)
• Avoid very large file sizes - keep images under 1MB where possible for faster loading
• Use high-resolution images so they look sharp on all screen sizes

Need help with images? Contact our support team and we'll be glad to assist.