Sunday, August 10, 2025

Manage Visual Website Feedback on Any Platform via Webhooks in Simple Commenter

One-Way Webhooks (Outbound)

How It Works

When a comment, reply, or delete action happens in Simple Commenter, you can configure a webhook to send that event’s data to an external service (e.g., Trello, Slack, Notion, Jira, Zapier).Each action type has its own webhook configuration:

  • Comment Webhook → Triggered when a new comment is created.
  • Reply Webhook → Triggered when a reply is added to a comment.
  • Delete Webhook → Triggered when a comment is archived (resolved).

Setting Up Webhooks

Step 1 — Navigate to Integrations

  • Account-level: Settings → Integrations
  • Domain-level: Domain → Integrations

Step 2 — Add a Webhook

  • Click "New Webhook"
  • Choose the type:
    • comment
    • reply
    • delete
  • Enter the Webhook URL (where Simple Commenter will send the data)
  • Choose HTTP Method (default: POST)
  • Optionally configure Authentication:
    • None
    • Bearer Token
    • Basic Auth
  • Toggle Active to ON
  • Save

Example Payloads

Comment Webhook Payload

Code Example
{
  "type": "comment",
  "commentNumber": 37,
  "title": "Bug in checkout",
  "text": "The payment button does not work.",
  "date": "2025-08-10T09:01:48.945Z",
  "by": "John Doe",
  "domain": "https://example.com",
  "slug": "/checkout",
  "link": "https://example.com#simple-comment=68985ffc7674ebabbd7b23da",
  "metadata": {
    "userAgent": "Mozilla/5.0 ...",
    "screenWidth": 1800,
    "screenHeight": 1169,
    "viewportWidth": 563,
    "viewportHeight": 1065,
    "language": "en-US",
    "timeZone": "Europe/Tallinn",
    "platform": "macOS",
    "platformVersion": "15.6.0",
    "model": "Unknown",
    "browserVersion": "139.0.7258.67"
  },
  "attachments": [
    {
      "type": "file",
      "url": "https://simple-commenter.hel1.your-objectstorage.com/user-uploads/.../webhook.png?...",
      "name": "webhook.png"
    }
  ]
}


Reply Webhook Payload

Code Example
{
  "type": "reply",
  "commentNumber": 37,
  "replyText": "Thanks, we are fixing this now.",
  "date": "2025-08-10T09:15:00.000Z",
  "by": "Support Agent",
  "domain": "https://example.com",
  "slug": "/checkout",
  "link": "https://example.com#simple-comment=68985ffc7674ebabbd7b23da",
  "metadata": {},
 "attachments": [
    {
      "type": "file",
      "url": "https://simple-commenter.hel1.your-objectstorage.com/user-uploads/.../webhook.png?...",
      "name": "webhook.png"
    }
  ]
}


Delete Webhook Payload

Code Example
{
  "type": "delete",
  "commentNumber": 37,
  "date": "2025-08-10T09:20:00.000Z",
  "by": "Support Agent",
  "domain": "https://example.com",
  "slug": "/checkout",
  "link": "https://example.com#simple-comment=68985ffc7674ebabbd7b23da"
}

Two-Way Integrations (Inbound)

How It Works

Two-way integrations allow external systems (like Trello, Slack, or your own backend) to send actions back into Simple Commenter.This is done using Integration Tokens that you generate in Simple Commenter. The external system makes a POST request to:

Code Example
https://www.simplecommenter.com/api/integrations/action

Generating an Integration Token

Step 1 — Go to Integrations

  • Account-level: Settings → Integrations
  • Domain-level: Domain → Integrations

Step 2 — Generate Token

  • Click "Generate Token"
  • Select Allowed Actions:
    • reply → Add a reply to a comment
    • delete → Archive (resolve) a comment
  • If generating for a specific domain, the token will only work for that domain.
  • If generating at account level, the token can work for all domains (you must pass domain in the request payload).
  • Copy the token — it will only be shown once.

Making a Request

Endpoint

Code Example
POST https://www.simplecommenter.com/api/integrations/action

Headers

Code Example
Content-Type: application/json

Request Body

Reply Example

Code Example
{
  "token": "YOUR_GENERATED_TOKEN",
  "action": "reply",
  "payload": {
    "commentId": "6899896cd81f1abdf59635cc",
    "text": "Thanks for the feedback!",
    "email": "bot@example.com",
    "name": "Integration Bot",
    "domain": "example.com"
  }
}


Delete Example

Code Example
{
  "token": "YOUR_GENERATED_TOKEN",
  "action": "delete",
  "payload": {
    "commentId": "6899896cd81f1abdf59635cc",
    "domain": "example.com"
  }
}


Response Format

Success

Code Example
{
  "success": true,
  "message": "Integration action completed successfully",
  "result": {
    "_id": "6899896cd81f1abdf59635cc",
    "archived": true
  }
}


Error

Code Example
{
  "success": false,
  "error": "Invalid token"
}


Security Recommendations

  • Keep your integration token secret — treat it like a password.
  • Restrict tokens to only the actions you need.
  • For account-level tokens, always pass the correct domain in the payload.

Common Use Cases

  • Trello: When a Trello card is updated, send a reply or delete action back to Simple Commenter.
  • Slack: Use a Slack bot to reply to comments directly from a Slack thread.
  • Custom Backend: Sync comment status changes from your internal tools.

Simple Commenter in 2 minutes