> **Source:** https://knowledge.leegality.com/document-execution/template/html-template/formatting-and-editing/images-static
> **Site:** Leegality Knowledge Base — https://knowledge.leegality.com
> **About:** Leegality is a document execution platform covering eSigning, stamps, NeSL, workflows, and REST API integration.
> **Navigation:** Every article on this site has a plain-text version at `<article-url>.txt` (this format). To get an index of all articles with their `.txt` links, read: https://knowledge.leegality.com/llms.txt
> **AI Guide:** For instructions on how to navigate this knowledge base as an AI agent, read: https://knowledge.leegality.com/ai-readable.txt

---
# Insert Image

The Insert Image feature allows you to embed static images directly into your HTML template. In the HTML Template editor, you can add images from a URL or by uploading files, configure dimensions, set margins and borders, and add alternative text for accessibility.

## Insert an image

Add static images to your template that are part of the document itself.

1. In the HTML Template editor, place your cursor where you want the image to appear.
2. On the toolbar, click **Insert Image**.
3. A popup will open with **Basic** and **More Options** tabs.
4. Configure the image settings as needed.
5. Click **OK** to insert the image.

## Insert Image Configuration

When you select the Insert Image option, a configuration popup appears with the following sections:

### Basic Settings

Choose how you want to add the image to your template:

#### 1. URL Option

Select this checkbox to insert an image from a web URL:

- Check the **URL** checkbox
- Enter the complete image URL in the provided field
- The image will be loaded from the specified web address

**Example:**
```
https://www.example.com/images/logo.png
```

> **Info**
>
> Make sure the URL is publicly accessible and points directly to an image file. The URL should start with `http://` or `https://`.

#### 2. Upload Option

Select this checkbox to upload an image file from your computer:

- Check the **Upload** checkbox
- Click the file browser to select an image from your device
- The image will be uploaded and embedded in the template

**Supported Formats:** JPG, JPEG, PNG, GIF, SVG

> **Warning — Important**
>
> You cannot choose both URL and Upload options simultaneously. Select only one method to insert your image.

### More Options

These are optional settings to customise the image appearance and behavior:

#### 1. Alternative Text

Enter text that describes the image:

- This text appears in the filled form if the image fails to load
- It's also used for accessibility purposes (screen readers)
- Helps users understand what the image represents

#### 2. Image Vertical Margin (px)

Set the vertical spacing above and below the image:

- Controls the top and bottom margin around the image
- Enter the value in pixels
- **Default: 0 px**

#### 3. Image Horizontal Margin (px)

Set the horizontal spacing to the left and right of the image:

- Controls the left and right margin around the image
- Enter the value in pixels
- **Default: 0 px**

#### 4. Image Border (px)

Add a border around the image:

- Controls the thickness of the border around the image
- Enter the value in pixels
- **Default: 0 px** (no border)

#### 5. Custom Width and Height

Specify custom dimensions for the image:

##### Width (px)
- Enter the desired width of the image in pixels
- Leave empty to use original image width

##### Height (px)
- Enter the desired height of the image in pixels
- Leave empty to use original image height

#### 6. Maintain Aspect Ratio

Enable this checkbox to automatically adjust dimensions proportionally:

- When **enabled**: Changing width automatically calculates the appropriate height (or vice versa) to maintain the image's original proportions
- When **disabled**: You can set width and height independently, which may distort the image

**When to use:**
- **Enable** to preserve image proportions and prevent distortion (recommended for most images)
- **Disable** only if you need exact dimensions regardless of distortion

> **Info**
>
> Maintaining aspect ratio ensures your images don't appear stretched or squashed. It's recommended to keep this checkbox enabled for professional-looking documents.

## Manage & edit images

Once an image is inserted, you can modify its properties or reposition it.

### Edit an image

1. **Double-click** on the image in the editor, or **right-click** and select **Image Properties**.
2. The Insert Image popup will open with current settings.
3. Make your desired changes to any field.
4. Click **OK** to save changes.

### Move or duplicate an image

1. **Right-click** the image.
2. Select **Cut** or **Copy**.
3. Move your cursor to the new location and right-click **Paste**.

### Remove an image

1. **Click** to select the image.
2. Press the **Delete** or **Backspace** key on your keyboard.

## Preview your image

Before finalizing your template, check how the image will appear in the generated PDF.

1. Locate the **Preview** button in the bottom-left corner of the editor.
2. Click **Preview** to view how the image appears in the document.
3. Verify the image displays correctly with the configured settings.

> **Info**
>
> The Insert Image feature is for static images that are part of the template. If you need users to upload their own images during document signing, use the [Upload Image](https://knowledge.leegality.com/document-execution/template/html-template/formatting-and-editing/images-upload) field instead.