⌘ K

Een widget aan je website toevoegen

Instatus biedt drie manieren om je status op je eigen website te tonen: een zwevende widget die tijdens incidenten verschijnt, een badge voor je footer en een summary.json-endpoint om een eigen widget mee te bouwen.

Ga naar dashboard.instatus.com, kies je statuspagina, open Widget, kies het type widget en kopieer de code om er een toe te voegen.

Zwevende widgetKleuren en positie, script in de body van je paginaBadgeLicht of donker, drie formaten, insluiten in de footerEigen widgetsummary.json met status, incidenten, onderhoud

Hoe voeg ik een zwevende widget toe?

  1. Log in bij Instatus via instatus.com/login en kies je statuspagina.

  2. Ga naar Widget → Floating.

  3. Pas je widget naar wens aan door te kiezen:

  • Achtergrondkleur
  • Voorgrondkleur
  • Positie van je widget ten opzichte van de pagina
  1. Kopieer het script van je widget en plak het in de body van je HTML-pagina.
De widget verschijnt zodra er een nieuw incident is 🙀

  1. Log in bij Instatus via instatus.com/login en kies je statuspagina.

  2. Ga naar Widget → Badge.

  3. Kies de lichte of donkere modus

  4. Kies je formaat (klein, middel of groot) 🤏

  5. Plaats de code in je HTML-pagina

Je zou nu een badge in je footer moeten zien 🥳

Hoe bouw ik een eigen widget?

Haal summary.json op van je statuspagina om de huidige status, actieve incidenten en onderhoud als live data voor je eigen widget te gebruiken:

https://[YOUR-STATUS-PAGE]/summary.json

Voorbeeldrespons:

{
  "page": {
    "name": "Instatus",
    "url": "https://instat.us",
    "status": "HASISSUES"
  },
  "activeIncidents": [
	{
      "name": "We're facing an issue with our API",
      "started": "Sat Jun 11 2022 18:55:50 (Coordinated Universal Time)",
      "status": "INVESTIGATING",
      "impact": "MAJOROUTAGE",
      "url": "https://testing-widget.instatus.com/incident/cl4a"
    }
  ],
  "activeMaintenances": [
    {
      "name": "Database maintenance",
      "start": "Sat Jun 11 2022 18:55:54 (Coordinated Universal Time)",
      "status": "NOTSTARTEDYET",
      "duration": "60",
      "url": "https://testing-widget.instatus.com/maintenance/cl4"
    }
  ]
}

Mogelijke paginastatussen:

  • UP
  • HASISSUES
  • UNDERMAINTENANCE

Mogelijke incidentstatussen:

  • INVESTIGATING
  • IDENTIFIED
  • MONITORING
  • RESOLVED

Mogelijke onderhoudsstatussen:

  • NOTSTARTEDYET
  • INPROGRESS
  • COMPLETED
Nu kun je een eigen widget maken! 🥳
Hierna
Een eigen domein gebruiken voor je Instatus-paginaLeer hoe je een eigen domein voor je statuspagina gebruikt.