openstatus logoDashboard

How to Embed a Status Page in an Iframe

Problem

You want to embed your openstatus status page in your marketing site, dashboard, or docs — without the full header, footer, and navigation that the standalone page includes.

Solution

Append ?embed to your status page URL to render a chromeless version suitable for embedding. Use the value to choose exactly which sections to show.

URL contract

https://<your-slug>.openstatus.dev/?embed=<sections>
  • The value ?embed=all turns on embed mode and shows all sections. The header, navigation, and subscribe form are hidden. Non-whitelabel pages keep a compact "powered by openstatus.dev" attribution; whitelabel pages hide the footer entirely.
  • The value can also be a comma-separated list of specific sections to show (e.g. ?embed=title,banner).

Sections

KeyRenders
titlePage title + description
bannerCurrent incident / maintenance banner
componentsComponent health trackers
feedPast status reports and maintenances

Unknown keys are silently ignored. Section names are case-insensitive. If nothing valid is provided (e.g. ?embed=, or ?embed=unknown), all sections are shown.

Section keys apply to the root status page URL only. Other routes (/monitors, /events, /events/report/:id) accept ?embed to hide header/footer chrome, but their content is unchanged — they render normally inside the frame.

Additional parameters

ParamValuesBehavior
themelight, darkForces the theme. Honored only when ?embed is present. Falls back to system preference, then the page's configured default.

Examples

Show the full chromeless page:

<iframe
  src="https://status.example.com/?embed=all"
  width="100%"
  height="600"
  style="border: 0;"
></iframe>

Show only the title and current banner:

<iframe
  src="https://status.example.com/?embed=title,banner"
  width="100%"
  height="300"
  style="border: 0;"
></iframe>

Show components in forced dark theme:

<iframe
  src="https://status.example.com/?embed=components&theme=dark"
  width="100%"
  height="400"
  style="border: 0;"
></iframe>

Notes and caveats

  • Height: iframes do not auto-size to their content. Set a height attribute appropriate for the sections you enabled.
  • Internal links (e.g. clicking an incident banner) open in a new tab when embedded, so your site's iframe stays put.
  • Password-protected status pages may not authenticate correctly inside iframes due to browser third-party cookie restrictions (Safari ITP, Chrome). Visitors may need to authenticate on the full status page first.
  • Attribution: non-whitelabel pages show a centered "powered by openstatus.dev" link in the embed footer. Whitelabel pages hide the footer entirely.
  • Sandboxed iframes must include at least allow-scripts allow-same-origin for the status page to run, plus allow-popups for the "open in new tab" behavior on internal links.