# StatusPageV3 Construct - Checkly Docs

> Learn how to configure status pages with the Checkly CLI.

Source: https://www.checklyhq.com/docs/constructs/status-page-v3/

---

- Configuration StatusPageV3 Options

- Referencing an existing page
- Importing an existing page

Status Pages

# StatusPageV3 Construct

Learn how to configure status pages with the Checkly CLI.

Use `StatusPageV3` to create a public status page. A v3 page has no cards or services: its structure is declared with [`StatusPageV3Component`](https://www.checklyhq.com/docs/constructs/status-page-v3-component) constructs that point at the page, and incidents can be automated with [`StatusPageV3AutomationRule`](https://www.checklyhq.com/docs/constructs/status-page-v3-automation-rule).

A page’s generation cannot change in place. A logical ID that was deployed as a [`StatusPage`](https://www.checklyhq.com/docs/constructs/status-page) (deprecated) cannot be redeployed as a `StatusPageV3`, or vice versa. To move a v2 page to v3, use the migration wizard in the Checkly app.

```
import { StatusPageV3, StatusPageV3Component } from "checkly/constructs"

const statusPage = new StatusPageV3("company-status", {
name: "Company Status",
url: "company-status",
})

new StatusPageV3Component("api-component", {
statusPage,
name: "API",
displayOrder: 0,
})
```

```
import {
StatusPageV3,
StatusPageV3AutomationRule,
StatusPageV3Component,
} from "checkly/constructs"

const statusPage = new StatusPageV3("acme-status", {
name: "A.C.M.E Status",
url: "acme-status",
customDomain: "status.acme.com",
description: "Live status of all A.C.M.E services.",
logo: "https://acme.com/logo.png",
logoDark: "https://acme.com/logo-dark.png",
redirectTo: "https://acme.com",
favicon: "https://acme.com/favicon.ico",
defaultTheme: "AUTO",
footerText: "A.C.M.E Inc.",
privacyPolicyLink: "https://acme.com/privacy",
termsOfServiceLink: "https://acme.com/terms",
})

// A group with one component nested under it.
const userFacing = new StatusPageV3Component("user-facing-group", {
statusPage,
type: "GROUP",
name: "User-Facing Services",
displayOrder: 0,
})

const webApp = new StatusPageV3Component("web-app-component", {
statusPage,
name: "Web Application",
parent: userFacing,
displayOrder: 1,
})

// Open an incident on the page when a check tagged "web" fails.
new StatusPageV3AutomationRule("web-outage-rule", {
statusPage,
name: "Web outage",
tags: ["web"],
firstUpdate: "We are investigating an issue with the web application.",
lastUpdate: "The issue is resolved.",
components: [{ component: webApp, targetImpact: "MAJOR_OUTAGE" }],
})
```

## ​ Configuration

### ​ `StatusPageV3` Options

​

string

required

Name of the status page, shown in the header and browser title. **Usage:**

```
new StatusPageV3("company-status", {
name: "Company Status",
/* More options... */
})
```

​

string

required

Subdomain under `checkly-status-page.com`. Must be unique across all Checkly accounts. **Usage:**

```
new StatusPageV3("company-status", {
name: "Company Status",
url: "company-status", // Creates company-status.checkly-status-page.com
})
```

​

string

Custom domain for your status page (e.g., `status.example.com`). Requires DNS configuration and domain verification. See [Custom domains](https://www.checklyhq.com/docs/communicate/status-pages/customization#custom-domain). **Usage:**

```
new StatusPageV3("company-status", {
name: "Company Status",
url: "company-status",
customDomain: "status.example.com",
})
```

​

string

Short text shown at the top of the public page.

​

string

URL to a logo image shown in the header. Must be publicly accessible.

​

string

URL to a logo used when the page is in dark mode. Falls back to `logo` when unset.

​

string

URL to redirect users to when they click the logo.

​

string

URL to a favicon image shown in browser tabs. Must be publicly accessible.

​

string

default: "AUTO"

Default color theme for the page: `'LIGHT'`, `'DARK'`, or `'AUTO'` (follows system preference).

​

string

Link to your privacy policy, shown in the page footer.

​

string

Link to your terms of service, shown in the page footer.

​

string

Free-form text shown in the page footer.

​

string

Google Analytics tag ID (e.g. `G-XXXXXXXXXX`) embedded on the public page.

​

boolean

default: "true"

Whether search engines may index the public page.

## ​ Referencing an existing page

Use `StatusPageV3.fromId()` to attach components and automation rules declared in code to a page created in the UI, without managing the page itself:

```
import { StatusPageV3, StatusPageV3Component } from "checkly/constructs"

const statusPage = StatusPageV3.fromId("2fbb3ec1-0d32-4e1e-964a-9f4823502e2f")

new StatusPageV3Component("cdn-component", {
statusPage,
name: "CDN",
displayOrder: 3,
})
```

## ​ Importing an existing page

`checkly import status-page: ` imports a v3 page together with its components and automation rules into your project.

Was this page helpful?

[Suggest edits](https://github.com/checkly/docs/edit/main/constructs/status-page-v3.mdx)[Raise issue](https://github.com/checkly/docs/issues/new?title=Issue%20on%20docs&body=Path:%20/constructs/status-page-v3)

[RetryStrategyBuilder Construct Previous](https://www.checklyhq.com/docs/constructs/retry-strategy)[StatusPageV3Component Construct Next](https://www.checklyhq.com/docs/constructs/status-page-v3-component)

[x](https://x.com/checklyhq)[github](https://github.com/checkly)[linkedin](https://linkedin.com/company/checkly)

[Powered by This documentation is built and hosted on Mintlify, a developer documentation platform](https://www.mintlify.com/?utm_campaign=poweredBy&utm_medium=referral&utm_source=checkly-422f444a)