How to add Customer Thermometer to On Premise Signatures

Relevant Products: Signature Manager Exchange Edition | Signature Manager Outlook Edition | Signature Manager Office 365 Edition | Mail Disclaimers | Template Editor

Scenario

Customer Thermometer is a great way to gain feedback from the services your company provides. However, you are unsure on how to integrate this into the signature.

Resolution

Customer Thermometer allows you to generate code based on the fields you choose. It is this code you will need to adapt for use with signature designer.

It is recommended to copy and paste the code into a notepad or html editor to see the code, we also suggest to save the file as .html so you can view the layout in a web browser. Pick out all the elements required, images, urls, text, fonts, sizes and colour codes.

Viewing the .html file in a web browser, will give you some idea of where to place the text and images, with your signature.

Start by using a standard html table, with four rows. 

In the first table cell, insert a composite field from the dynamic content menu.

Typing in the question at the start of the customer thermometer.

Using the Field Properties, set the text to Arial, 9pts, Bold = True. 

In the next empty cell, create another standard html table of 4 columns x 2 rows. 

The table will be generated, in the empty cell.

In each of the cells in the top row, insert a custom image, enter each of the image urls one by one.

You will be able to find the images in the code generated by Customer Thermometer. The custom image tool, can only accept one hosted image url at a time. 

At the same time, you can add the urls for the customer feed back, into the hyperlink section 

You will need to ensure that the {fields} shown in the url, are changed to work with your Active Directory Data, from the template. To do this, use the arrow keys to find the curly fields, then highlight the field and delete it. 

Then, using the drop down arrow, add the same Active Directory Field into the same space.

The fields should turn purple inside the url 

Once happy, click OK and the image will generate in the table cell .

Repeat the process for the other images. 

In the cells underneath each image, create a composite field for each of the captions. 

At this point, don't worry about the alignment, you can set the central alignments later on.

Each composite field will have it's own colour, and set to Arial 9pts, which can be added using the field properties on the right hand size. 

Once all the colours are set, the design will start to look similar to the html version.

In the next table cell,  add in another composite field, with the feedback text, and set this to Arial, 9pts. 

Lastly, using the custom image  tool, copy the url for the last image from the html code and, the hyperlink that goes with it, into the last table cell 

Currently the Customer Thermometer section, will look misaligned and close together. You can fix this by using padding and central alignments, using the cell properties. 

Working on each row, add padding to where it is required using the style box. Click inside the table cell, next to the element you wish to add padding to. 

As an example, padding-bottom:13px; has been set in the cell containing 'How are we doing?'

Each Image will require a horizontal alignment of Centre, and each of the three table cells, before the Red logo, will require padding to the right.

Each text box, under the images will require a horizontal alignment of Center, and each cell will need a padding of 10px to the top, as well as this each table cell, apart from the last one will need 10px  to the right.

The last couple of cells, will require padding to the top. Add padding elsewhere in the signature, above and or below of the Customer Thermometer, to give the main signature some space as well.

Clicking on each table, remove the 100% width, to ensure the section is displayed at the correct size. 

The end result should look similar to the design in the web browser.