Customize the mail template (v4.8.0+)


From Ametys 4.8.0

From version 4.8.0 onwards, e-mails sent by the Ametys application are in HTML format, composed of various presentation elements, an example of which is shown below:

The header and footer, as well as the font and text color, can be customized at the application or graphic charter level.

To override one or more graphic elements in your e-mails, start by adding a stylesheets/mail/standard/template.xsl :

  • or at the application level in the WEB-INF/params/view to apply the overload to all e-mails sent by the application
  • either in the graphic design of the file skins/[SKIN_NAME] so that the overload can be customized to suit the site

This file must contain at least

  • for a non-web application:
<xsl:import href="plugin:core-ui://stylesheets/mail/standard/template.xsl"/>
  • for a Web application
<xsl:import href="plugin:web://stylesheets/mail/standard/template.xsl"/>
  • for a charter extending the workspaces charter
<xsl:import href="skin:workspace://stylesheets/mail/standard/template.xsl"/>

The file will then contain the overloaded elements.

NOTE
If your charter is a variation of an existing charter Ametys Intranet or Ametys Workspaceany overloading for mail personalization must necessarily be done in the charter and not in the WEB-INF/params . The Ametys Intranet and Ametys Workspaces charters already have their own overloads, so these will always be preferred to WEB-INF/params.
Remember to import the mail template from the declined charter rather than the one from plugin web, for example. <xsl:import href="skin:intranet://stylesheets/mail/standard/template.xsl"/>

Header logo overload

To override the header logo, the "header-logo-img" template must be overridden.
For example:

<xsl:template name="header-logo-img">
 <img width="164" height="37" src="{ametys:skinImageBase64('img/mail/logo-mail.png')}" alt="My company"/>
</xsl:template>

Watch out!
The image must be resolved in base64 with ametys:skinImageBase64(String path) or pluginImageBase64(String plugin, String path)

Footer logo overload

To override the footer logo, the "footer-logo-img" template must be overridden.
For example:

<xsl:template name="footer-logo-img">
 <img width="164" height="37" src="{ametys:skinImageBase64('img/mail/logo-mail.png')}" alt="My company"/>
</xsl:template>

Watch out!
The image must be resolved in base64 with ametys:skinImageBase64(String path) or pluginImageBase64(String plugin, String path)

Color/font overload

To override the colors and/or fonts used, you can override the style variables defined by default in 01_Runtime\master\main\plugin-core-ui\stylesheets\mail\standard\components\styles.xsl

For example, to simply change the font of all text and the primary color:

<xsl:variable name="font-family">Trebuchet MS, Arial, sans-serif</xsl:variable>
<xsl:variable name="primary">#e8590c</xsl:variable>
<xsl:variable name="primary-light">#fceee6</xsl:variable>

The default font is "Tahoma".
If you wish to change it, be careful to choose a font that will be supported by all clients mail.
Here is a list of fonts that can be used in emails without risk: https://www.w3schools.com/cssref/ css_websafe_fonts .php

It is possible to go further in customizing the mail template.
However, as the format of e-mails is very sensitive, it is strongly recommended not to try to customize anything other than the logo, color and font, and footer text.

Example of overloading

You can download the mail.zip file and unzip it in your graphic charter's root directory to start your overload.

The ZIP includes a simple overload of the mail template for the logo and primary color used.
Modify the file's color codes stylesheets/mail/standard/components/styles.xsl and the resources/img/mail/logo-mail.png.
Don't forget to personalize the logo's alt text.

Below is a rendering of HTML mails with this overload:

 

 

 

 

 

 

 

 

Back to top