Kener provides two embedding mechanisms: badges (small SVG images you can drop into any Markdown or HTML) and widgets (iframes or script tags that render full status bars or charts).
Both are generated from Manage → Badges and Manage → Embed .
Status badges Badges are SVG images served directly from your Kener instance. There are three badge types:
Type URL path Shows Status /badge/<tag>/statusCurrent real-time status (UP, DOWN, DEGRADED, etc.) Uptime /badge/<tag>/uptimeUptime percentage over a time period Latency /badge/<tag>/latencyResponse latency over a time period
Use _ as the tag to aggregate all active monitors into a single badge.
/badge/<tag>/<type>[?param=value&...]
Status badge parameters: Parameter Description labelCustom label text (defaults to monitor name) labelColorLabel background color (hex without #, default 333) colorBadge value color (hex without #) styleBadge visual style (see below) localeLanguage for the status text (must be an activated locale)
Uptime / latency badge parameters: Parameter Description sinceLastTime window in seconds (default: 7776000 = 90 days) hideDurationSet to true to omit the time period from the label labelCustom label text labelColorLabel color (hex without #) colorBadge value color (hex without #) styleBadge visual style metricLatency metric: average (default), maximum, or minimum
Badge styles flat (default)
plastic
flat-square
for-the-badge
social
/badge/my-api/status?style=flat
Flat design with no gradient. This is the default when style is omitted. /badge/my-api/status?style=plastic
Classic gradient style reminiscent of Shields.io plastic badges. /badge/my-api/status?style=flat-square
Flat with sharp square corners. /badge/my-api/status?style=for-the-badge
Large, all-uppercase label style. /badge/my-api/status?style=social
Rounded social-media style with outline. The default style when no style parameter is provided is flat.
Dot badge A minimal colored dot SVG that reflects current status:
/badge/<tag>/dot[?animate=ping&fillColor=<hex>]
Parameter Description animateSet to ping for a pulsing animation fillColorOverride color (hex with #)
Using badges HTML
Markdown
Uptime badge (30 days)
For-the-badge style
< img src = "https://status.example.com/badge/my-api/status" alt = "my-api status" />
The Badge Generator at Manage → Badges builds the URL and snippets for you. Select a monitor, badge type, style, and colors, then copy the generated HTML or Markdown.
The badge generator also shows a live preview of the badge so you can verify colors and style before copying the code.
Widgets render a full interactive component inside an <iframe> or via a <script> tag.
There are three embed types:
Type Embed path Renders Status Bar /embed/monitor-<tag>Status bar with uptime percentage and day-by-day history Latency Chart /embed/latency-<tag>Line chart of response latency over time Live Events /embed/events/liveOngoing incidents and maintenance events in real time
/embed/monitor-<tag>?theme=light&days=90
Parameter Values Description themelight, darkColor theme days7, 30, 60, 90History window
Embed as an iframe (height ~70 px):
< iframe src = "https://status.example.com/embed/monitor-my-api?theme=light&days=90" width = "100%" height = "70" frameborder = "0" allowfullscreen = "allowfullscreen" > </ iframe >
Or as a script tag:
< script src = "https://status.example.com/embed/monitor-my-api/js?theme=light&days=90" ></ script >
/embed/latency-<tag>?theme=light&days=90&height=200&metric=average
Parameter Values Description themelight, darkColor theme days7, 30, 60, 90History window height100–300Chart height in px metricaverage, maximum, minimumLatency metric to display
< iframe src = "https://status.example.com/embed/latency-my-api?theme=light&days=90&height=200" width = "100%" height = "250" frameborder = "0" allowfullscreen = "allowfullscreen" > </ iframe >
/embed/events/live?theme=light&incidents=1&maintenance=1&tags=my-api,other-api
Parameter Values Description themelight, darkColor theme incidents0, 1Show incidents maintenance0, 1Show maintenance events tagsComma-separated monitor tags Filter by monitors; omit to show all global events
< iframe src = "https://status.example.com/embed/events/live?theme=light&incidents=1&maintenance=1" width = "100%" height = "300" frameborder = "0" allowfullscreen = "allowfullscreen" > </ iframe >
Getting embed code from the dashboard
Open the Embed Generator
Go to Manage → Embed .
Configure the embed
Select the embed type, monitor, theme, time period, and format (iFrame or Script).
Copy the code
Click the copy icon next to Embed Code and paste it into your external site.
Using a <script> tag embed may require updating your site’s Content Security Policy (CSP) to allow scripts from your Kener origin.
Enabling badge and embed links on the status page Visitors can access badge and embed links directly from each monitor’s sub-menu on the public status page. These options are controlled in Manage → Site Configurations → Monitor Sub Menu Options :
Share Badge — shows the badge share menu for each monitor.Share Embed — shows the embed share menu for each monitor.
Both are enabled by default.