Embeddable Widgets
Status badges, iframe widgets, and RSS feeds for embedding status anywhere.
Fyren provides several ways to embed your service status on external websites, dashboards, or documentation.
Status Badge
A Shields.io-compatible SVG badge showing your overall status.
Endpoints
| Endpoint | Description |
|---|---|
GET /api/v1/status/badge.svg | SVG badge image |
GET /api/v1/status/badge.json | JSON data for custom badge implementations |
GET /api/v1/status/badge | Redirects to .svg |
Query Parameters
| Parameter | Values | Default | Description |
|---|---|---|---|
style | flat, flat-square, plastic | flat | Badge style |
label | any string | status | Left-side label text |
Embed Examples
Markdown:
HTML:
<img src="https://status.example.com/api/v1/status/badge.svg" alt="Service Status">The badge is cached for 60 seconds.
Iframe Widget
A compact, embeddable HTML widget that shows your service status. Available in two styles.
Styles
| Style | Description |
|---|---|
compact | Summary view showing count (e.g., "5/6 operational") with a pulsing status dot |
full | Lists all components with individual status indicators |
Themes
| Theme | Description |
|---|---|
light | Light background |
dark | Dark background |
Embed Example
<iframe
src="https://status.example.com/widget?style=compact&theme=light"
width="300"
height="80"
frameborder="0"
style="border: none;"
></iframe>The widget sends postMessage events (fyren-resize) to the parent page for automatic height adjustment.
JavaScript Widget Loader
A script that creates and manages an iframe widget in any container on your page.
Embed Example
<script src="https://status.example.com/api/v1/status/widget.js" async></script>
<div data-fyren-widget></div>Data Attributes
| Attribute | Values | Default | Description |
|---|---|---|---|
data-theme | light, dark | light | Widget color theme |
data-style | minimal, compact, full | compact | Widget display style |
Programmatic API
The script exposes a global API for dynamic usage:
// Create a widget in a specific container
window.FyrenWidget.create(document.getElementById('my-status'));The loader uses MutationObserver to automatically detect data-fyren-widget elements added to the DOM after page load. The script is cached for 1 hour.
Embed Instructions Page
Fyren provides a built-in instructions page with copy-paste code snippets and live previews for both the badge and widget:
GET /api/v1/status/embed.htmlRSS Feed
A standard RSS 2.0 feed of recent incidents and maintenance events:
GET /api/v1/status/rssSubscribe in any RSS reader (Feedly, Miniflux, NewsBlur, etc.) for passive status updates without providing an email address.
See Also
- Status Page & Branding — Full status page customization