Cachet provides the ability to customize your status page with custom HTML and CSS. To customize your status page, navigate to the “Manage Customization” section under Settings found in your Cachet dashboard.

Custom Header HTML

From here, you can add custom HTML including scripts and styles into the header of your status page. This is an ideal section to add custom analytics scripts.

HTML or scripts placed in this section will be added to the <head> of your status page.

Fathom Analytics

We recommend Fathom Analytics for privacy-focused analytics. To add Fathom Analytics to your status page, you can use the following script:

<script src="https://cdn.usefathom.com/script.js" data-site="YOUR_SITE_ID" defer></script>

The Fathom link above is a referral link. If you sign up using the link, you’ll receive $10 credit. This helps support the Cachet project.

This section allows you to add custom HTML to the footer of your status page. This is an ideal section to add custom scripts or styles.

HTML or scripts placed in this section will be added to the end of the <body> of your status page.

Custom CSS

This section allows you to add custom CSS to your status page. This is an ideal section to add custom styles to your status page. You do not need to include <style> tags in this section, the CSS will be automatically wrapped in them.

CSS placed in this section is appended to Cachet’s custom styles.

You may make use of Cachet’s CSS variables in this section. Note that these variables are not complete and are subject to change.