diff --git a/static/css/channels.css b/static/css/channels.css index b4f2c3f9..d18c947a 100644 --- a/static/css/channels.css +++ b/static/css/channels.css @@ -185,6 +185,12 @@ table.channels-table > tbody > tr > th { .ai-step { margin: 2em 0; + counter-increment: ai-step; +} + +.ai-step .step-no::after { + content: counter(ai-step); + } .ai-step .step-no { diff --git a/static/img/integrations/setup_pdc_0.png b/static/img/integrations/setup_pdc_0.png new file mode 100644 index 00000000..e23d380a Binary files /dev/null and b/static/img/integrations/setup_pdc_0.png differ diff --git a/templates/integrations/add_matrix.html b/templates/integrations/add_matrix.html index 65bbd330..66f540c4 100644 --- a/templates/integrations/add_matrix.html +++ b/templates/integrations/add_matrix.html @@ -17,7 +17,7 @@

Setup Guide

- 1 +

Invite {{ matrix_user_id }} @@ -42,7 +42,7 @@

- 2 +

Look up the room's alias or ID, and paste it in the form @@ -59,7 +59,7 @@

- 3 +

{{ matrix_user_id }} will shortly join your room. After that, you are all set! From now on diff --git a/templates/integrations/add_mattermost.html b/templates/integrations/add_mattermost.html index fd3152bc..133112bf 100644 --- a/templates/integrations/add_mattermost.html +++ b/templates/integrations/add_mattermost.html @@ -18,7 +18,7 @@

- 1 + Log into your Mattermost account and select Integrations in the hamburger menu. @@ -32,7 +32,7 @@
- 2 +

In the "Integrations" screen, select Incoming Webhook and then Add Incoming Webhook. @@ -49,7 +49,7 @@

- 3 +

Copy the displayed URL and paste it down below.

Save the integration, and it's done!

diff --git a/templates/integrations/add_msteams.html b/templates/integrations/add_msteams.html index cb959ff9..fc78a5c9 100644 --- a/templates/integrations/add_msteams.html +++ b/templates/integrations/add_msteams.html @@ -17,7 +17,7 @@
- 1 +

Log into your Microsoft Teams account, click the Apps tab.

@@ -38,7 +38,7 @@
- 2 +

Select the channel where you want {% site_name %} to post notifications. @@ -54,7 +54,7 @@

- 3 +

Give the connector a descriptive name.

@@ -76,7 +76,7 @@
- 4 +

Copy the displayed webhook URL and paste it in the form below. Save the integration, and you are done! diff --git a/templates/integrations/add_opsgenie.html b/templates/integrations/add_opsgenie.html index 012a1d6e..4a3b91a8 100644 --- a/templates/integrations/add_opsgenie.html +++ b/templates/integrations/add_opsgenie.html @@ -17,7 +17,7 @@

Setup Guide

- 1 +

Log into your OpsGenie account, go to Settings > Integration list, @@ -38,7 +38,7 @@

- 2 + After adding the new integration, take note of its API Key, a long string of letters and digits. @@ -54,7 +54,7 @@
- 3 +

Paste the API Key down below, and make sure the correct service region is selected. Save the integration, and you are done! diff --git a/templates/integrations/add_pagerteam.html b/templates/integrations/add_pagerteam.html index 304f58ea..d9b2e27b 100644 --- a/templates/integrations/add_pagerteam.html +++ b/templates/integrations/add_pagerteam.html @@ -16,7 +16,7 @@

- 1 +

Log into your Pager Team account, select the rotation you wish to add this integration to. Click the Copy Webhook button.

@@ -31,7 +31,7 @@
- 2 +

Paste the Webhook URL below. Save the integration, and you are done!

diff --git a/templates/integrations/add_pagertree.html b/templates/integrations/add_pagertree.html index 059363fd..5732edbd 100644 --- a/templates/integrations/add_pagertree.html +++ b/templates/integrations/add_pagertree.html @@ -17,7 +17,7 @@
- 1 +

Log into your PagerTree account, click the Integrations tab. Then click the Create Integration button. @@ -36,7 +36,7 @@

- 2 +

In the Create Integration Form, fill out the details with appropriate values, but most importantly make sure the Integration Type is set to Healthchecks.io. Then click the Create button.

@@ -51,7 +51,7 @@
- 3 +

Copy the Endpoint address and paste it in the form below. diff --git a/templates/integrations/add_pd.html b/templates/integrations/add_pd.html index 41152c62..5daa8af7 100644 --- a/templates/integrations/add_pd.html +++ b/templates/integrations/add_pd.html @@ -18,7 +18,7 @@

Setup Guide

- 1 +

Log into your PagerDuty account, go to Configuration > Services, @@ -40,7 +40,7 @@

- 2 + After adding the new service, take note of its Integration Key, a long string of letters and digits. @@ -56,7 +56,7 @@
- 3 +

Paste the Integration Key down below. Save the integration, and it's done!

diff --git a/templates/integrations/add_pdc.html b/templates/integrations/add_pdc.html index 5feefeaa..24c4306e 100644 --- a/templates/integrations/add_pdc.html +++ b/templates/integrations/add_pdc.html @@ -15,6 +15,7 @@ you can set up {% site_name %} to create a PagerDuty incident when a check goes down, and resolve it when a check goes back up.

+ {% if connect_url %}
@@ -25,6 +26,7 @@
+ {% endif %} {% else %}

@@ -43,12 +45,36 @@

Setup Guide

+ {% if not connect_url %} +
+
+ +

+ {% if request.user.is_authenticated %} + Go + {% else %} + After logging in, go + {% endif %} + + to the Integrations page, + and click on Add Integration next to the + PagerDuty integration. +

+
+
+ Screenshot +
+
+ {% endif %} +
- 1 +

- After {% if request.user.is_authenticated %}{% else %}logging in and{% endif %} - clicking on "Alert with PagerDuty", you will be + Click on "Alert with PagerDuty", and you will be asked to log into your PagerDuty account.

@@ -62,7 +88,7 @@
- 2 +

Next, PagerDuty will let set the name and escalation policy for this integration. @@ -78,7 +104,7 @@

- 3 +

And that is all! You will then be redirected back to "Integrations" page on {% site_name %} and see diff --git a/templates/integrations/add_prometheus.html b/templates/integrations/add_prometheus.html index 3943548d..c9f73d1e 100644 --- a/templates/integrations/add_prometheus.html +++ b/templates/integrations/add_prometheus.html @@ -23,7 +23,7 @@

- 1 +

Look up your project's read-only API key in Project Settings › API Access. @@ -43,7 +43,7 @@

- 2 +

Edit Prometheus configuration and add a new section in the scrape_configs section. @@ -59,7 +59,7 @@

- 3 +

Reload Prometheus' configuration. You should now start seeing {% site_name %} data appear in Prometheus. diff --git a/templates/integrations/add_pushover_help.html b/templates/integrations/add_pushover_help.html index f10f320b..60874f96 100644 --- a/templates/integrations/add_pushover_help.html +++ b/templates/integrations/add_pushover_help.html @@ -25,7 +25,7 @@

- 1 +

After logging in, go to "Integrations → Add Pushover". Pushover supports different notification priorities from @@ -43,7 +43,7 @@

- 2 +

You will be redirected to pushover.net and @@ -61,7 +61,7 @@

- 3 +

That is all! You will now be redirected back to "Integrations" page on {% site_name %} and see diff --git a/templates/integrations/add_slack.html b/templates/integrations/add_slack.html index 5396d6c3..71a393ba 100644 --- a/templates/integrations/add_slack.html +++ b/templates/integrations/add_slack.html @@ -16,7 +16,7 @@

- 1 + Log into your Slack account and pick an appropriate Slack channel. From the dropdown next to channel's name, pick Add a service integration... @@ -30,7 +30,7 @@
- 2 + From the list of available integrations, select Incoming WebHooks, and click on Add Incoming WebHooks Integration. @@ -39,7 +39,7 @@
- 3 +

Copy the displayed WebHook URL and paste it down below.

Save the integration, and it's done!

diff --git a/templates/integrations/add_slack_btn.html b/templates/integrations/add_slack_btn.html index bc94be31..c5f32151 100644 --- a/templates/integrations/add_slack_btn.html +++ b/templates/integrations/add_slack_btn.html @@ -41,7 +41,7 @@
- 1 +

After {% if request.user.is_authenticated %}{% else %}signing in and{% endif %} clicking on "Add to Slack", you should @@ -60,7 +60,7 @@

- 2 +

You should now be on a page that says "{% site_name %} would like access to TEAM NAME". Select the channel you want to @@ -77,7 +77,7 @@

- 3 +

That is all! You will now be redirected back to "Integrations" page on {% site_name %} and see diff --git a/templates/integrations/add_telegram.html b/templates/integrations/add_telegram.html index 9e44e6ea..750751d2 100644 --- a/templates/integrations/add_telegram.html +++ b/templates/integrations/add_telegram.html @@ -56,7 +56,7 @@

Setup Guide

- 1 +

From your Telegram client, invite {{ bot_name }} @@ -78,7 +78,7 @@

- 2 +

Type /start command. If there are multiple bots in the group, type /start@{{ bot_name }} instead. @@ -94,7 +94,7 @@

- 3 +

Click or tap on the confirmation link, and {% site_name %} will open in a browser window asking you to confirm the new integration.

diff --git a/templates/integrations/add_victorops.html b/templates/integrations/add_victorops.html index 7a370582..038081f5 100644 --- a/templates/integrations/add_victorops.html +++ b/templates/integrations/add_victorops.html @@ -17,7 +17,7 @@

Setup Guide

- 1 +

Log into your VictorOps account, go to Settings > Schedules, @@ -34,7 +34,7 @@

- 2 +

Go to Settings > Integrations and scroll to the bottom of the page. Choose an existing @@ -51,7 +51,7 @@

- 3 + In the right hand side of Settings > Integrations page, select REST Endpoint, and click on @@ -67,7 +67,7 @@
- 4 +

Paste the Post URL from step 3 in the field below, being careful to replace $routing_key with your actual Routing Key from step 2. Save the integration,