Adding Images to Documents

Written By Jessica Moore (Super Administrator)

Updated at October 29th, 2026

Images can be added to SchemeServe documents in different ways, depending on where you want the image to appear.

  • Standard headers, footers and watermarks are uploaded from the right-hand panel in the Documents area.
  • Images within the document body can be inserted and resized using the image button at the top of the document editor.
  • Images within the document body can also be added or amended directly in the document's HTML.

Choose the correct method: Use the Header and Footer panel for branding that should appear consistently at the top or bottom of document pages. Use the editor or HTML method when the image forms part of the document's main content.


Headers, footers and watermarks are uploaded from the Documents area. They are not added by placing an image at the top or bottom of the document's HTML.

  1. Open the relevant scheme and go to Documents.
  2. Find the Header and Footer panel on the right-hand side.
  3. Use the Insurer dropdown to choose All Insurers or a specific insurer.
  4. Under Header, Footer or Watermark, select Choose file.
  5. Select the image and choose Upload.

Choose the Correct Insurer

  • All Insurers: applies the image to every insurer unless an insurer-specific image overrides it.
  • Specific Insurer: applies the image only to documents generated for that insurer.

Apply the Image to a Document

Uploading the image makes it available, but does not automatically switch it on for every document.

  1. Open the document template you want to update.
  2. Open Other Options and go to Header & Footer.
  3. Enable the required option, such as Standard Header, Standard Footer or Watermark.
  4. Save the document.

Image requirements: Standard header, footer and watermark images should be PNG files. Full-width header and footer images should be 1190px wide. A full-page watermark should be 1200px × 1796px.


2. Add an Image Using the Document Editor

For an image that should appear within the body of a document, you can use the image control at the top of the editor. You do not need to open the HTML to use this method.

  1. Open the document template in the document editor.
  2. Place the cursor where you want the image to appear.
  3. Select the Insert/Edit Image button in the toolbar at the top of the editor.
  4. Add or select the image.
  5. Use the image settings to adjust its size as required.
  6. Save the document.

Edit an Existing Image

Select the image in the document and reopen Insert/Edit Image to amend its size or other available image settings.

Remember: An image inserted through the editor becomes part of that document's content. It is different from a standard header or footer uploaded in the right-hand Documents panel.


3. Add or Amend an Image in HTML

You can also add or amend an image within the document's HTML. This is useful when you need more control over its exact size, spacing or alignment.

  1. Open the document template.
  2. Open the HTML or Source view from the editor toolbar.
  3. Add a new <img> tag or find the existing image you want to amend.
  4. Update the image URL, size, spacing or alignment.
  5. Return to the standard editor view and save the document.

Basic Image HTML

<img src="IMAGE_URL" alt="Company Logo">

Replace IMAGE_URL with the image's accessible URL. If the image was inserted through the editor, its existing URL will already appear in the HTML.

Change the Image Size

<img src="IMAGE_URL" alt="Company Logo" style="width:200px; height:auto;">
  • width:200px sets the image width.
  • height:auto keeps the original proportions and helps prevent distortion.

Align the Image

Left:

<div style="text-align:left;"> <img src="IMAGE_URL" style="width:200px; height:auto;"> </div>

Centre:

<div style="text-align:center;"> <img src="IMAGE_URL" style="width:200px; height:auto;"> </div>

Right:

<div style="text-align:right;"> <img src="IMAGE_URL" style="width:200px; height:auto;"> </div>

Tip: If you only need to add or resize an image, the Insert/Edit Image button is usually the simplest option. Use HTML when you need more precise control.


4. Preview and Test the Document

  1. Save the document changes.
  2. Open a suitable test case within the scheme.
  3. Generate or preview the document.
  4. Check the header, footer or watermark if one has been enabled.
  5. Check any images placed within the document body.
  6. Review the size, proportions, alignment and position of each image.

Important: Always check the generated document. Its final layout may differ from the appearance of the editor.


5. Troubleshooting

Issue Likely Cause What to Check
Header or footer does not appear The image is uploaded but not enabled on the document Open Other Options → Header & Footer and enable the required option
Wrong header or footer appears The image was uploaded against the wrong insurer Check All Insurers and any insurer-specific upload
Image in the document body does not appear The image was not inserted correctly or its URL is inaccessible Reopen Insert/Edit Image or review the image URL in HTML
Image is stretched The width and height do not preserve the original proportions Resize it in Insert/Edit Image or use height:auto in HTML
Image looks different in the generated document The final document renderer handles the layout differently from the editor Adjust the image and generate another test document

Key Points to Remember

  • Upload standard headers, footers and watermarks from the right-hand panel in the Documents area.
  • Enable an uploaded header, footer or watermark within the individual document's options.
  • Use Insert/Edit Image to add or resize an image within the document body without editing code.
  • Use HTML when you need more precise control over an inline image's size, spacing or alignment.
  • Always generate a test document and check the final output.

Need help? If you need assistance adding or formatting images in your SchemeServe documents, contact our Obsessive Support team.