A partir de Ametys 4.8.0
A partir de la version 4.8.0 les mails envoyés par l'application Ametys sont des mails au format HTML composés de divers éléments de présentation, dont voici un exemple:
L'entête et le pied de page ainsi de la police, couleur du texte peuvent être personnaliser au niveau applicatif ou au niveau de la charte graphique.
Pour surcharger un ou plusieurs éléments graphiques des mails, commencez par ajouter un fichier stylesheets/mail/standard/template.xsl :
- soit au niveau applicatif dans le dossier WEB-INF/params pour que la surcharge soit appliquée à tous les mails envoyés par l'application
- soit au niveau de la charte graphique dans le dossier skins/[SKIN_NAME] pour que la surcharge soit personnalisée en fonction du site
Ce fichier devra contenir à minima:
- pour une application non-web:
<xsl:import href="plugin:core-ui://stylesheets/mail/standard/template.xsl"/>
- pour une application Web
<xsl:import href="plugin:web://stylesheets/mail/standard/template.xsl"/>
- pour une charte étendant la charte des espaces projets (workspaces)
<xsl:import href="skin:workspaces://stylesheets/mail/standard/template.xsl"/>
Le fichier contiendra ensuite les éléments surchargés.
Surcharge du logo d'entête
Pour surcharger le logo d'entête, le template "header-logo-img" doit être surchargé.
Par exemple:
<xsl:template name="header-logo-img">
<img width="164" height="37" src="{ametys:skinImageBase64('img/mail/logo-mail.png')}" alt="My company"/>
</xsl:template>Attention !
L'image doit être résolue en base64 avec ametys:skinImageBase64
Surcharge du logo du pied de page
Pour surcharger le logo du pied de page, le template "footer-logo-img" doit être surchargé.
Par exemple:
<xsl:template name="footer-logo-img">
<img width="164" height="37" src="{ametys:skinImageBase64('img/mail/logo-mail.png')}" alt="My company"/>
</xsl:template>Attention !
L'image doit être résolue en base64 avec ametys:skinImageBase64
Surcharge des couleurs / polices
Pour surcharger les couleurs et/ou polices utilisées, vous pouvez surcharger les variables de styles définies par défaut dans 01_Runtime\master\main\plugin-core-ui\stylesheets\mail\standard\components\styles.xsl
Par exemple pour simplement changer la police de tous les textes et la couleur primaire:
<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>
La police utilisée par défaut est "Tahoma".
Si vous souhaitez la changer, prenez garde de choisir une police qui sera supportée par tous les clients mail.
Voici une liste de police pouvant être utilisées dans les mails sans risque : https://www.w3schools.com/cssref/css_websafe_fonts.php
Il est possible d'aller plus loin dans la personnalisation du template de mail.
Cependant le format des mails étant très sensible, il est vivement recommandé de ne pas chercher à personnaliser autre chose que le logo, couleur et police, texte de pied de page.
Exemple de surcharge
Vous pouvez télécharger le fichier mail.zip et le décompressez dans le répertoire racine de votre charte graphique pour débuter votre surcharge.
Le ZIP comprends une simple surcharge du template de mail pour le logo et la couleur primaire utilisés.
Modifiez les codes couleur du fichier stylesheets/mail/standard/components/styles.xsl et le fichier resources/img/mail/logo-mail.png.
Pensez également à personnaliser la texte alternatif (alt) du logo.
Ci dessous un rendu des mails HTML avec cette surcharge:
Retour en haut