If you use Expert mode to create your Letsignit signature model, here are some of our best practices and advice to improve your model: 

*Please note: your HTML code may be interpreted differently depending on the email client. The advice and tips below will allow you to achieve the model desired.

The general construction: 

  • Insert your personal information and images in a table and apply a height/width

  • The maximum dimensions recommended for a banner are 600 x 200 px.

  • Don’t add the tags <head></head>; some tags don’t serve a purpose and are deleted by certain email clients. 

  • Avoid using tags such as <em> and <strong>. Preferably, put a style in order to avoid the font and/or size from being modified in Outlook. 

The attributes: 

  • Surround each attribute with a double { } symbol as shown:                            {{NAME OF ATTRIBUTE}} please refer to the "display name" column under user attributes tab

Full name - name.fullName

Family name - name.familyName

Surname -  name.givenName

Title - title

Service – department

Landline - phone.primary

Mobile phone - phone.mobile

Street - streetAddress

City – city

Zip code - postalCode

State or departement – state

Country - country

Company - companyName

Webpage – website

Email - email

  • To avoid the appearance of white lines in the case where the attribute is not filled, move the <br>  at the end of the top line, to the prefix of the attribute in the line below.

  • Specify before each link the following protocol:"https://" so that each external link is active on all navigators 

  • Because the styles of the links in the <a> tags are sometimes removed (example: the color of the link), it is necessary to add the <span> tag and put the link style within the <span> and surround it by the <a> tag.

  • Add the attribute name {{Email}} after the href in the tag <a></a> to make your emails clickable (and mostly to control the color of the link)

  • To clear the underscore of a URL link, surround the text with: <spanstyle="text-decoration: none"></span> in addition to text-decoration none in the link style in the <a> tag. 

Applying a style: 

  • Always consider the style in-line to limit the risks of misinterpretation by certain email clients. 

  • Put the style in-line in the tags <table>, <td>, <span>, <p> 

  • Always specify a font color, when it is not specified, certain email clients force a color by default (dark gray for example with Hotmail)

  • Indicate the hexadecimal values for the colors- Easily find your hexadecimal code by using a converter

  • Insert a height-line in the style to manage the interlines in the same cell 

  • To limit the risks of misinterpretation, use the font systems or groups of font systems (the first will have the advantage) 

The images: 

  • Resize the images before storing them to avoid having deformed images when arriving to the receiver’s email box. 

  • Specify the height and width of the image within the tag <img>

  • Verify the name of the images, they should not contain a space.

Tips : 

  • Avoid blank if there is no information filled for a variable : use IF tag {{%if%}} {{%endif%}} including the <br> which is checking if there is an information filled

Please find example below : 

{{name.fullName}} <br>
 {% if phone.primary %}T. {{phone.primary}} <br> {% endif %}
{{title}} <br>

  • Insert prefix or suffix : use IF tag {{%if%}} {{%endif%}} which is checking if there is an information before or after the name of the variable

Please find example below :

{{name.fullName}} <br>
 {% if phone.primary %}T. {{phone.primary}}{% endif %} <br>

Below are a few useful links: 

#HTML #Signature #Expert mode

Did this answer your question?