Using background images in Exclaimer Cloud

Relevant Products: Exclaimer Cloud - Signatures for Office 365 | Exclaimer Cloud - Signatures for G Suite |Exclaimer Cloud - Signatures for Exchange

Scenario 

Your signature design requires a background image, in the template.

Resolution 

The procedure to use a background image includes:
Checking the image size, then

Inserting the background image.

Checking the image size

To check the background image size:

1. Navigate to the folder where the image is saved, right-click on the image and select Properties.
   
   Example:
   
2. In the Properties window, select the Details tab. You will see the size of the image under Dimensions.
   
   
   
3. If the image is too big, you can use an image editor, such as Adobe Photoshop, Gimp, Paint.net and so on to reduce the image down.
   
   The recommended width for an image is 600px wide.

Once you know what the image size is, you can proceed to build the signature template.

Inserting the background image

To insert the background image into your signature template:

1. Drag the custom table onto the signature canvas.
   
   
   
2. Choose a 1x1 table structure, this will allow you to upload a background image to start with.
   Example:
   
   
   
3. In the Table properties window, upload the required custom image.
   
   
   
   Warning: Using background images will render the signature as a bitmap - this is behaviour by design to ensure the image can be viewed by all mail clients and devices.

   A confirmation message is displayed: 

   
   
   
4. Click Yes to proceed.
   
   
5. Select Size and set the Height and Width of the image onto the table.
   You will now be able to see the image appear inside the table and in the design preview. 
   Example:
   
   
   Once the image is in place, you can layer on tables and elements to further construct your signature template and use padding and alignments to space out the design further.
   
   In this example, a table of two columns with white text on the dark background of the image is displayed:
   
   
   
6. In the example, Padding is also added to the left of the table - this is to move it away from the edge of the background image.
   For more information, see the What do the coloured borders mean in the Exclaimer Cloud signature designer?
   
   This may look odd when structuring the signature, but it is normal for this to occur. You can see in the preview how this looks.
   For example:
   
   
   
7. In this example, the table is aligned to be vertically centred and aligned left horizontally:
   
   
   
8. Padding is also used on the Green Line of the left-hand table cell to add space before the contact fields:
   
   
   This is the end result, a nice clean and simple design:
   
   
   If your design is more complicated, use more table cells where needed and don't be afraid to use padding to align the signature accordingly.