On this page

All pages






In Totara 10 a default look was applied to HTML emails, in the form of a surrounding design which includes background colours. If you've got a custom theme then changing those colours, or the whole surrounding design is something you may want to look at.

To do this you can simply create a new file within your theme:

theme/{themename}/templates/core/email_html.mustache

Set the contents of this file to the following:

{{{body}}}

What you've done here is remove all styling from HTML emails, leaving just the content of the email. From here you can add any HTML you want, in order to style the surrounding design as you wish. 

Just remember, because it is being sent as an email you will need to include any CSS as inline style attributes. 

The following illustrates a more complex example of what can be done:

<div style='font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;'>
    <div style="clear:both;">
        <div style="display:inline-block;"><h1 style="padding:10px;"><a style="text-decoration: none;" href="{{sitewwwroot}}">{{sitefullname}}</a></h1></div>
        <div style="float:right;"><p style="padding:10px;">{{toname}}</p></div>
    </div>
    <div style="background-color:#e0245d;margin-top:10px;"><h2 style="padding:1em;"><strong>{{subject}}</strong></h2></div>
    <div style="margin:20px;">{{{body}}}</div>
    <div style="background-color:#e0245d;color:#FFF;"><p style="padding:10px;"><strong>{{siteshortname}}</strong></p></div></div>

There are several placeholders available when constructing the template:

PlaceholderDescription
sitefullname

The fullname of the site sending this email.

siteshortname 

The shortname of the site sending this email.

sitewwwroot 

The URL for the site sending this email.

subject 

The subject of the email.

to 

The email address of the user this is being sent to.

toname 

The fullname of the user this email is being sent to.

from

The email address this is being sent from.

fromname 

The fullname of the user sending the email (noting this is often no reply, or the support user).

Finally the current template can be found at theme/basis/templates/core/email_html.mustache

For more information on customising design like this have a read of our guide on overriding mustache templates.