Додавання віджета на сайт

Instatus пропонує три способи показати свій статус на власному сайті: плавучий віджет, який спливає під час інцидентів, бейдж для футера та ендпоінт summary.json для створення власного віджета.

Щоб додати віджет, перейдіть на dashboard.instatus.com, виберіть свою сторінку статусу, відкрийте Віджет, виберіть тип віджета й скопіюйте код.

Як додати плавучий віджет?

1. Увійдіть в Instatus на instatus.com/login і виберіть свою сторінку статусу.

2. Перейдіть до розділу Віджет → Floating.

3. Налаштуйте віджет під себе, вибравши:

• колір тла
• колір переднього плану
• розташування віджета на сторінці

4. Скопіюйте скрипт віджета й вставте його в тіло вашої HTML-сторінки.

Як додати бейдж статусу у футер?

1. Увійдіть в Instatus на instatus.com/login і виберіть свою сторінку статусу.

2. Перейдіть до розділу Віджет → Badge.

3. Виберіть світлу або темну тему

4. Виберіть розмір (малий, середній чи великий) 🤏

5. Вставте код у свою HTML-сторінку

Як створити власний віджет?

Отримайте summary.json зі своєї сторінки статусу, щоб мати поточний статус, активні інциденти й обслуговування як живі дані для власного віджета:

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

Приклад відповіді:

{
  "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"
    }
  ]
}

Можливі статуси сторінки:

• UP
• HASISSUES
• UNDERMAINTENANCE

Можливі статуси інциденту:

• INVESTIGATING
• IDENTIFIED
• MONITORING
• RESOLVED

Можливі статуси технічного обслуговування:

• NOTSTARTEDYET
• INPROGRESS
• COMPLETED