KlickTipp から Gmail への自動化:トランザクショナルメールの送信

中級

これはMiscellaneous, Multimodal AI分野の自動化ワークフローで、10個のノードを含みます。主にHtml, Gmail, Klicktipp, KlicktippTriggerなどのノードを使用。 KlickTipp から Gmail へ自動化:通知メールを送信

前提条件
  • Googleアカウント + Gmail API認証情報
ワークフロープレビュー
ノード接続関係を可視化、ズームとパンをサポート
ワークフローをエクスポート
以下のJSON設定をn8nにインポートして、このワークフローを使用できます
{
  "id": "F86WEBBC9zuow0d8",
  "meta": {
    "instanceId": "95b3ab5a70ab1c8c1906357a367f1b236ef12a1409406fd992f60255f0f95f85",
    "templateCredsSetupCompleted": true
  },
  "name": "Automated KlickTipp to Gmail: Send Transactional Emails",
  "tags": [],
  "nodes": [
    {
      "id": "9ecd589a-9151-4a27-96e7-2fdffc436155",
      "name": "メール配信ステータス: 送信済み",
      "type": "n8n-nodes-klicktipp.klicktipp",
      "notes": "This node updates the contact in KlickTipp with the email delivery status (\"Sent\") and stores the HTML body of the message.",
      "position": [
        800,
        -96
      ],
      "parameters": {
        "fields": {
          "dataFields": [
            {
              "fieldId": "field222442",
              "fieldValue": "Sent"
            },
            {
              "fieldId": "field222482",
              "fieldValue": "={{ $('Generate HTML template').item.json.html }}"
            }
          ]
        },
        "resource": "subscriber",
        "operation": "update",
        "lookupEmail": "={{ $('Recieve the data from KlickTipp').item.json.email }}"
      },
      "credentials": {
        "klickTippApi": {
          "id": "K9JyBdCM4SZc1cXl",
          "name": "DEMO KlickTipp account"
        }
      },
      "typeVersion": 3
    },
    {
      "id": "26569378-7755-4ef5-acba-56e38d3035de",
      "name": "メール配信ステータス: 失敗",
      "type": "n8n-nodes-klicktipp.klicktipp",
      "notes": "This node updates the contact in KlickTipp with the email delivery status (\"Failed\") and stores the HTML body of the message.",
      "position": [
        800,
        80
      ],
      "parameters": {
        "fields": {
          "dataFields": [
            {
              "fieldId": "field222442",
              "fieldValue": "Failed"
            },
            {
              "fieldId": "field222482",
              "fieldValue": "={{ $('Generate HTML template').item.json.html }}"
            }
          ]
        },
        "resource": "subscriber",
        "operation": "update",
        "lookupEmail": "={{ $('Recieve the data from KlickTipp').item.json.email }}"
      },
      "credentials": {
        "klickTippApi": {
          "id": "K9JyBdCM4SZc1cXl",
          "name": "DEMO KlickTipp account"
        }
      },
      "typeVersion": 3
    },
    {
      "id": "4eb8b64e-5125-4180-b228-8d30a7fc4b1d",
      "name": "付箋",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -128,
        -96
      ],
      "parameters": {
        "color": 7,
        "height": 288,
        "content": "## 1. Get data."
      },
      "typeVersion": 1
    },
    {
      "id": "84bbe8d3-4554-474b-a9e6-9e9e046f3ba1",
      "name": "付箋1",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        128,
        -96
      ],
      "parameters": {
        "color": 7,
        "width": 304,
        "height": 288,
        "content": "## 2. Create an email body."
      },
      "typeVersion": 1
    },
    {
      "id": "8a709ea0-9b4e-477f-ae26-221350072e6c",
      "name": "付箋2",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        448,
        -96
      ],
      "parameters": {
        "color": 7,
        "height": 288,
        "content": "## 3. Send an email."
      },
      "typeVersion": 1
    },
    {
      "id": "32b28c8c-3bdc-420c-8518-fb943396f89b",
      "name": "付箋3",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        704,
        -160
      ],
      "parameters": {
        "color": 7,
        "width": 384,
        "height": 432,
        "content": "## 4. Update email delivery status."
      },
      "typeVersion": 1
    },
    {
      "id": "c868cb98-b306-4291-933d-3a2bf95938a2",
      "name": "付箋4",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -720,
        -160
      ],
      "parameters": {
        "width": 580,
        "height": 1528,
        "content": "Community Node Disclaimer: This workflow uses KlickTipp community nodes.\n\n\n### How It Works\n\n**Automate transactional emails from KlickTipp to Gmail**  \nThis workflow receives contact data from a KlickTipp Outbound rule, generates a personalized HTML email, and sends it via Gmail. Key fields (e.g., first name, company, website, phone, or other custom fields) are dynamically mapped into the body. After sending, the workflow saves the email’s HTML content and writes back an Email delivery status (“Sent” or “Failed”) to the contact in KlickTipp for clear visibility.\n\n### Key Features\n\n**KlickTipp Outbound Trigger**\n- Starts when a KlickTipp Outbound rule calls the webhook (e.g., after a tag is applied).\n- Accepts payload with recipient email and optional custom fields (first name, company, website, phone, etc.).\n- Easy to adapt for confirmations, updates, welcomes, and announcements.\n\n**HTML Email Composer**\n- Builds a clean, brandable HTML template with safe fallbacks.\n- Supports per-contact personalization via mapped fields.\n\n**Gmail Delivery**\n- Sends via Gmail (OAuth) with From/Reply-To, Subject, and HTML body.\n- Supports CC/BCC and attachments if needed.\n\n**Delivery Status Write-Back**\n- On success: updates a KlickTipp custom field (e.g., **Email delivery status = Sent**).\n- On error: updates the same field to **Failed** (error details available in execution logs).\n\n### Setup Instructions\n\n**Install and Configure Nodes**\n- Add/enable KlickTipp community nodes and authenticate with valid API credentials.\n- Create/authorize a **Gmail** credential (OAuth) and select it in the **Send an email** node.\n- Paste/import your HTML into the **Generate HTML template** node.\n- Activate the workflow.\n\n### Workflow Logic\n1. **Trigger from KlickTipp:** Outbound sends contact data to the workflow.\n2. **Generate HTML:** Build personalized HTML (and optional plain-text).\n3. **Send via Gmail:** Deliver the message with the Gmail node.\n4. **On Success:** Update KlickTipp contact → **Email delivery status: Sent**.\n5. **On Error:** Update KlickTipp contact → **Email delivery status: Failed** (see logs for details).\n\n### Benefits\n- **Immediate, personalized communication** without manual steps.\n- **Consistent branding** with reusable HTML templates.\n- **Clear observability** by writing back delivery status to KlickTipp.\n- **Flexible & extensible** for many message types beyond payments.\n\n### Testing and Deployment\n- Tag a test contact in KlickTipp to trigger the Outbound rule.\n- Verify the Gmail email arrives with correct personalization.\n- Confirm the **Email delivery status** field updates to **Sent** (or **Failed** for negative tests).\n- Review execution logs and adjust field mappings if necessary.\n\n### Notes\n- **Customization:** Swap templates, add CC/BCC, attachments, or a plain-text part for deliverability."
      },
      "typeVersion": 1
    },
    {
      "id": "2f1cb57b-3fdd-4009-b98d-50f9f2a66a41",
      "name": "HTMLテンプレート生成",
      "type": "n8n-nodes-base.html",
      "notes": "This node generates the HTML layout for the email body (including styling and structure) that will be used in the outgoing message.",
      "position": [
        192,
        0
      ],
      "parameters": {
        "html": "<!DOCTYPE html>\n<html>\n<head>\n  <meta charset=\"UTF-8\">\n  <title>Thank You</title>\n  <style>\n    body {\n      margin: 0;\n      padding: 16px;\n      font-family: Arial, Helvetica, sans-serif;\n      font-size: 14px;\n      color: #111111;\n      background: #f5f5f5;\n    }\n\n    /* Layout */\n    .wrapper {\n      max-width: 600px;\n      margin: 0 auto;\n      background: #ffffff;\n      padding: 20px;\n      border-radius: 6px;\n      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);\n    }\n\n    /* Typography */\n    h2.title {\n      margin: 0 0 12px 0;\n      font-size: 20px;\n      font-weight: bold;\n      color: #2c3e50;\n    }\n\n    p {\n      margin: 0 0 10px 0;\n    }\n\n    /* Links */\n    a {\n      color: #1155cc;\n      text-decoration: underline;\n    }\n\n    /* Contact block */\n    .contact-info {\n      margin: 15px 0;\n    }\n\n    .footer {\n      margin-top: 20px;\n    }\n  </style>\n</head>\n<body>\n  <div class=\"wrapper\">\n    <h2 class=\"title\">Thank you for using KlickTipp!</h2>\n\n    <p>Hello {{ $json.CustomFieldFirstName || 'there' }},</p>\n    <p>We appreciate your trust in KlickTipp. Your account details have been updated successfully.</p>\n\n    <div class=\"contact-info\">\n      <p><strong>Website:</strong> <a href=\"{{ $json.fieldWebsite }}\">{{ $json.CustomFieldWebsite }}</a></p>\n      <p><strong>Phone:</strong> {{ $json.CustomFieldPhone }}</p>\n    </div>\n\n    <p>If you have any questions, feel free to reply to this email — we’re here to help!</p>\n\n    <p class=\"footer\">Best regards,<br>The KlickTipp Team</p>\n  </div>\n</body>\n</html>"
      },
      "typeVersion": 1.2
    },
    {
      "id": "19f20661-4d76-4f69-9047-592877aa1ccd",
      "name": "KlickTippからデータ受信",
      "type": "n8n-nodes-klicktipp.klicktippTrigger",
      "notes": "This node listens for KlickTipp outbound events and triggers the workflow when data is sent.",
      "position": [
        -64,
        0
      ],
      "webhookId": "5fc3c4e7-1958-40bd-9dfe-0793d8e6bc0e",
      "parameters": {},
      "credentials": {
        "klickTippApi": {
          "id": "K9JyBdCM4SZc1cXl",
          "name": "DEMO KlickTipp account"
        }
      },
      "typeVersion": 1
    },
    {
      "id": "d1ff857e-92bf-4136-a436-b226c648c9d1",
      "name": "メール送信",
      "type": "n8n-nodes-base.gmail",
      "notes": "This node sends the generated HTML email to the contact's email address retrieved from KlickTipp.",
      "onError": "continueErrorOutput",
      "position": [
        512,
        0
      ],
      "webhookId": "dd1be801-424b-4bba-b923-250aff53e95e",
      "parameters": {
        "sendTo": "={{ $('Recieve the data from KlickTipp').item.json.email }}",
        "message": "={{ $json.html }}",
        "options": {
          "senderName": "KlickTipp team",
          "appendAttribution": false
        },
        "subject": "Thank you!"
      },
      "credentials": {
        "gmailOAuth2": {
          "id": "sHa4x4SLQL195FUJ",
          "name": "Invalid credentials"
        }
      },
      "notesInFlow": false,
      "retryOnFail": false,
      "typeVersion": 2.1,
      "alwaysOutputData": false
    }
  ],
  "active": true,
  "pinData": {
    "Recieve the data from KlickTipp": [
      {
        "json": {
          "email": "example@gmail.com",
          "CustomFieldPhone": "123456789",
          "CustomFieldWebsite": "https://awesome-website.com",
          "CustomFieldFirstName": "John"
        }
      }
    ]
  },
  "settings": {
    "executionOrder": "v1"
  },
  "versionId": "2710b3dc-5a0f-48d4-9541-04dbb1fea53c",
  "connections": {
    "d1ff857e-92bf-4136-a436-b226c648c9d1": {
      "main": [
        [
          {
            "node": "9ecd589a-9151-4a27-96e7-2fdffc436155",
            "type": "main",
            "index": 0
          }
        ],
        [
          {
            "node": "26569378-7755-4ef5-acba-56e38d3035de",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "2f1cb57b-3fdd-4009-b98d-50f9f2a66a41": {
      "main": [
        [
          {
            "node": "d1ff857e-92bf-4136-a436-b226c648c9d1",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "19f20661-4d76-4f69-9047-592877aa1ccd": {
      "main": [
        [
          {
            "node": "2f1cb57b-3fdd-4009-b98d-50f9f2a66a41",
            "type": "main",
            "index": 0
          }
        ]
      ]
    }
  }
}
よくある質問

このワークフローの使い方は?

上記のJSON設定コードをコピーし、n8nインスタンスで新しいワークフローを作成して「JSONからインポート」を選択、設定を貼り付けて認証情報を必要に応じて変更してください。

このワークフローはどんな場面に適していますか?

中級 - その他, マルチモーダルAI

有料ですか?

このワークフローは完全無料です。ただし、ワークフローで使用するサードパーティサービス(OpenAI APIなど)は別途料金が発生する場合があります。

ワークフロー情報
難易度
中級
ノード数10
カテゴリー2
ノードタイプ5
難易度説明

経験者向け、6-15ノードの中程度の複雑さのワークフロー

作成者
KlickTipp

KlickTipp

@KlickTipp

Reach more people. 100% GDPR compliant. Quickly create automated email campaigns, SMS and marketing automations. Market your knowledge independently of Google & Co., sell lucrative products and activate your customers.

外部リンク
n8n.ioで表示

このワークフローを共有

カテゴリー

カテゴリー: 34