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=allturns 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
| Key | Renders |
|---|---|
title | Page title + description |
banner | Current incident / maintenance banner |
components | Component health trackers |
feed | Past 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
| Param | Values | Behavior |
|---|---|---|
theme | light, dark | Forces 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
heightattribute 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-originfor the status page to run, plusallow-popupsfor the "open in new tab" behavior on internal links.