Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
158 changes: 115 additions & 43 deletions communicate/dashboards/configuration.mdx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
title: 'Dashboard Configuration'
description: 'Configure your dashboard to display your checks and metrics.'
description: "Add checks to your dashboard, control who has access, and customize your dashboard's look and feel."
sidebarTitle: 'Configuration'
---
<Frame>
Expand All @@ -20,78 +20,150 @@ sidebarTitle: 'Configuration'
## Setting Up Your Dashboard

<Steps>
<Step title="Configure Check Tags">
Add relevant tags to the checks you want to display on your dashboard
<Step title="Add tags to checks and monitors">
Add relevant tags to all the checks and monitors that you'd like to display on your dashboard.

</Step>

<Step title="Create Dashboard">
Set up a new dashboard and configure basic settings
Create a new dashboard and configure basic settings.
</Step>

<Step title="Apply Tag Filters">
Specify which tags should determine dashboard content
<Step title="Apply tag filters">
Add tags to your dashboard to specify which checks to show.
</Step>

<Step title="Customize Appearance">
Configure branding, colors, and layout options
<Step title="Customize appearance (optional)">
Customize your dashboard's look and feel using custom CSS rules.
</Step>

<Step title="Set Up Custom Domain">
Optionally configure a custom domain for professional branding
<Step title="Set up a custom domain (optional)">
Optionally configure a custom domain for professional branding.
</Step>

<Step title="Test and Share">
Verify dashboard functionality and share with intended audience
<Step title="Share the URL">
Once your dashboard is ready, you can share it with anyone using its URL.
</Step>
</Steps>

## Basic Settings

## Dashboard Privacy and Access Control
- **Title:** Add a title like "ACME status dash". This is separate from your Checkly URL or custom domain.
- **Description:** Add a clarifying text to explain to visitors what they are looking at.
- **Checks:** Specify the tags of the checks you want to show on the dashboard. By default we show all checks.
You can also choose to hide the tags from the dashboard.

By default, Checkly dashboards are public and accessible to anyone with the URL. You can restrict access by enabling password protection or Checkly account authentication.
## Checkly URL

> **Plan Requirements**: Private dashboards are available on Team and Enterprise plans. Checkly account login is exclusive to Enterprise customers.
Every dashboard comes with a configurable custom subdomain under the `checkly-dashboards.com` domain. By default,
we generate a random ID. You can change this subdomain to anything you like as long as it is unique among all Checkly users.
Typically, a company name works best, e.g. `acme.checkly-dashboards.com`

### Setting Up Password Protection
<Frame>
<img
className="block dark:hidden"
src="/images/next/dashboard-url-light.png"
alt="Light mode interface"
/>
<img
className="hidden dark:block"
src="/images/next/dashboard-url-dark.png"
alt="Dark mode interface"
/>
</Frame>

<Steps>
<Step title="Navigate to Dashboard Settings">
Go to the dashboard you want to protect and access its settings
</Step>
## Custom Domain

<Step title="Enable Password Protection">
Toggle on password protection and click "Save" to apply changes
</Step>
You can host your dashboard under your own domain. To make this work, you need to do two things:

<Step title="Generate Password">
Click the "Generate Password" button that appears after saving
</Step>
1. Add a valid custom domain to your dashboard setting.

<Step title="Secure Your Password">
Copy the password from the modal - **this is the only time you'll see it in plaintext**
</Step>
</Steps>
<Frame>
<img
className="block dark:hidden"
src="/images/next/dashboard-domain-light.png"
alt="Light mode interface"
/>
<img
className="hidden dark:block"
src="/images/next/dashboard-domain-dark.png"
alt="Dark mode interface"
/>
</Frame>

2. Create a CNAME record in your DNS that points to **checkly-dashboards.com**

Any DNS provider will have the option to easily add CNAME records. For example, on AWS Route 53 this looks as follows.

<Warning>
**Important**: We don't store passwords in plaintext. If lost, you'll need to generate a new password and update all users with the new credentials.
</Warning>
<Frame>
<img
className="block dark:hidden"
src="/images/docs/images/dashboards-v2/aws_cname.png"
alt="Light mode interface"
/>
<img
className="hidden dark:block"
src="/images/docs/images/dashboards-v2/aws_cname.png"
alt="Dark mode interface"
/>
</Frame>

In some cases, our provider will ask you to verify you are the owner of the domain by adding another `TXT` record to
your DNS. You will see a notice similar to the one below.

<Frame>
<img
className="block dark:hidden"
src="/images/docs/images/dashboards-v2/dashboards_txt_record.png"
alt="Light mode interface"
/>
<img
className="hidden dark:block"
src="/images/docs/images/dashboards-v2/dashboards_txt_record.png"
alt="Dark mode interface"
/>
</Frame>

## Access Control

### Accessing Protected Dashboards
By default, Checkly dashboards are public and visible to anyone who knows the URL. You can set a dashboard to private, limiting access to users with a password or Checkly account.

Protected dashboards work with both access methods:
### Enabling Authentication

**Password Authentication** (Team and Enterprise plans)
- Available on custom domains and default `https://[dashboardId].checkly-dashboards.com` URLs
- Use the generated password to access the dashboard
<Note>
Private dashboards are only available on certain plans. For more details, see our [Pricing page](https://www.checklyhq.com/pricing).
</Note>

**Checkly Account Login** (Enterprise only)
- Available only on default `https://[dashboardId].checkly-dashboards.com` URLs
- Click "Login with Checkly" and sign in with your existing account
- Supports all authentication methods (Google, GitHub, username/password)
To enable authentication on a dashboard:

1. Navigate to the settings of the dashboard you wish to modify.
2. Toggle on the "Password Protection" setting.
3. Click "Save" to apply the changes.
4. Next, the "Generate Password" button will appear, click this. It will open a modal which shows you your new private dashboard password.

<Warning>
Remember that dashboards are public by default. Always review which checks and data you're exposing before sharing dashboard URLs with external audiences.
Be careful, **this is the only time you will see this password in plaintext**. We do not store the password in plaintext, so if it is ever lost, you will need to regenerate a new one and inform any users of the new credentials.
</Warning>

### Accessing Private Dashboards

After enabling password protection for your dashboard, you can continue to visit it via any custom domain you may have enabled, as well as the default `https://[dashboardId].checkly-dashboards.com` domain. The password authentication will work via both channels.

<Note>
Checkly account login is only available to Enterprise customers.
</Note>

If visiting via the `https://[dashboardId].checkly-dashboards.com` domain, you can also select "Login with Checkly" and sign in with your existing Checkly account via any of the supported methods (i.e. Google, Github, Username and Password). This is an Enterprise-only feature.

## Look and Feel

- **Logo:** Display your company logo (or any image) on the top left side of your dashboard.
- **Logo link:** Add a clickable destination URL for your logo. When visitors click the logo, they’ll be redirected to your specified website (typically your company homepage).
- **Favicon:** Set a custom favicon for browser tabs and bookmarks.
- **Auto paginate:** Automatically switch between dashboard pages when you have multiple pages of checks.
- **Auto refresh:** Set how often the dashboard refreshes—choose between 1, 5, or 10 minutes.
- **Show header:** Toggle visibility of the dashboard’s title and description.
- **Show check run links:** Adds a clickable link to each check result so team members can inspect them. Off by default.
- **Show and hide P-stats:** Toggle the visibility of the performance stats for all checks on the dashboard.

Next to the preset tweaks you can do to your dashboard, you can also apply [custom CSS styles](/communicate/dashboards/custom-css).
Loading