Email Templates Customization
Statuspal allows you to fully customize the look of your subscriber emails (confirmation and status notifications), you'll find this settings under Sidebar > Subscriptions > Sub. Settings:
The Layout Template
First you'll need to configure a layout template, basically the parent template that will render the content template under {{ content }}, this way you can reuse some HTML and styles across the content templates, see an example here.
The Content Templates
Then you can configure the template for both types of emails, you can see examples of both containing the supported variables here.
Premailer
We use Premailer on the email templates before sending the emails, so CSS styles are converted to inline style attributes and other niceties.
Test and Enable
Once you've configured the templates (and clicked on Submit) you can send a test email before you enable the templates, if they look good you can enable them so they are used on all future emails.
Available email template variables
When customizing the email templates HTML the following variables are available:
| Translations | |
| t_update | "Update" |
| t_affected_services | "Affected services" |
| t_find_out_more | "Find out more at our" |
| t_status_page | "Status Page" |
| t_manage_subscription | "Manage subscription" |
| t_open_report |
"Open incident report" or "Open maintenance report" |
| Incident variables | |
| status_page.name | The status page name |
| incident.type_name | The incident type name (Minor, Major) |
| incident.title | The title of the incident |
| incident.type_color_class | The CSS class that we'll apply to set the color of the notification |
| incident.url | The URL to the incident |
| activity.activity_type_name | The incident update type name (Issue, Investigating, Monitoring, Resolved, etc) |
| activity.description | The incident update description |
| maintenance_information | If a maintenance, the start and end of the maintenance will be here |
| services | The list of services, rendered as HTML <div class="services">...</div> |
Notification email subject variables
You can customize the incident notification subject via a custom translation editing the subscriber_email.subject field, you can reference variables through the format {{variable_name}}.
The following variables are available:
| activity_type_name | The incident update type name (Issue, Investigating, Monitoring, Resolved, etc) |
| status_page_name | The status page name |
| incident_type_name | The incident type name (Minor, Major) |
| incident_id | The incident ID |
| incident_title | The title of the incident |
Customizing your Templates to Include your Company Logo
Including your company logo is easy with the fields described above, after adding your company logo this is how the emails will look:
Simply use the HTML content found in this Gist file and replace the logo image (<img ... class="logo"/>) with your logo image.
You don't have a Status Page yet? go ahead and create one in seconds at Statuspal.io