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 color of the text, 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 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:workspaces://stylesheets/mail/standard/template.xsl"/>
The file will then contain the overloaded elements.
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
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
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