integrations: Add documentation for Delighted.

templates/zerver/integrations.html

@@ -495,6 +495,45 @@
 
     </div>
 
+    <div id="delighted" class="integration-instructions">
+
+      <p>
+        Zulip supports integration with Delighted and can notify you
+        about updates in feedback responses organized by Delighted.
+      </p>
+
+      <p>
+        First, create the stream you'd like to use for Delighted notifications,
+        and subscribe all interested parties to this stream. We
+        recommend the name <code>delighted</code>. Next, create a bot named Delighted
+        and retrive the API key of the bot and place it into the API parameter in the URL below.
+      </p>
+
+      <p><code>{{ external_api_uri_subdomain }}/v1/external/delighted?api_key=abcdefgh&amp;stream=delighted</code></p>
+
+      <p>
+        Modify the parameters of the URL above, where <code>api_key</code> is the API key of your Zulip bot,
+        and <code>stream</code> is the stream name you want the
+        notifications sent to.
+      </p>
+
+      <p>
+        Go to your <a href="https://delighted.com/integrations/webhooks">Delighted Webhook Integration settings panel</a>.
+        Under <code>Send webhook notifications for:</code>: input the above URL with the modifications into
+        the URL textbox and press <code>Save and turn on</code> to finish.
+      </p>
+
+        <img class="screenshot" src="/static/images/integrations/delighted/000.png" />
+
+      <p>
+        <b>Congratulations! You're done!</b><br /> When an issue occurs,
+        you'll get a notification like this:
+      </p>
+
+      <img class="screenshot" src="/static/images/integrations/delighted/001.png" />
+
+    </div>
+
     <div id="deskdotcom" class="integration-instructions">