Knowledge Base

How to create a signature with an image as a background

Problem:

You cannot create a signature with an image as a background.

Solution:

CodeTwo Exchange Rules family of products does not have a built-in option to create signatures with images in the background. However, it may be possible to compose such signatures via the workarounds described below.

Important

These solutions might not work for some of the popular email clients (e.g. Outlook and Outlook on the web/OWA). Even though you can set an image as a background in the CodeTwo software, Outlook and OWA still ignore such images (they are not displayed in emails).

Info

You can only use images pulled from a web location in these methods. Images added as a background from a local resource will not work. Additionally, you need to be aware that web images may not be visible to the recipients if their email client's security settings do not allow external content to be automatically displayed.

Solution 1

  1. Open the signature editor and click the Table button on the ribbon. Choose a single cell (1 x 1) table (Fig. 1.).

272-1
Fig. 1. Adding a table in the signature editor (the interface may vary slightly depending on the software).

  1. Switch to the HTML source view using the </> Source button (Fig. 2.).

272-2
Fig. 2. The Source view button (the interface may vary slightly depending on the software).

  1. In the source view, edit the attributes of the table by adding the following code background=<path to your web-based image>, e.g. background=https://[your image web source]/[image file], as in the example (Fig. 3.).

272-3
Fig. 3. The source code of the table with an image as a background.

If you are using CodeTwo Exchange Rules Pro 2 or CodeTwo Rules Family (versions 2007 4.x, 2010 3.x or 2013 2.x), please use <table style="background: url('https://[your image web source]/[image]');"> instead of using the background HTML attribute, as it is obsolete and no longer supported in newer versions of CodeTwo software.

  1. Once the source code modification is complete, you can go back to editing your signature. You can use normal text or placeholders (AD fields), as in any other signature (Fig. 4.).

272-4
Fig. 4. An example of a signature.

Solution 2

  1. Create a table-based signature as presented in Solution 1 above.
  2. Switch to the HTML source view in the signature editor.
  3. Find the cell definition in which you want to have a background set up (cell definition starts with <td>).
  4. Insert the following line after the <td> tag:
    <!--[if gte vml 1]>
    <v:image style='width: 100px; height: 50px; position: absolute; top: 0; left: 0; border: 0; z-index: -1;' src="https://[your image web source]/[image file]" />
    <![endif]-->
    
  5. To properly position the image in the background, you need to adjust the parameters in the line above, especially the image dimensions and location.