Automated KlickTipp to Gmail: Send Transactional Emails

1. Workflow Overview

This workflow automates sending personalized transactional emails from KlickTipp contacts via Gmail, incorporating real-time status updates back into KlickTipp. It is designed to trigger on KlickTipp outbound events (such as tag applications), generate a branded HTML email with dynamic personalization, send the email through Gmail, and update KlickTipp contact fields with the email delivery status ("Sent" or "Failed"). This ensures immediate, consistent, and trackable communication for transactional use cases like confirmations, updates, or welcomes.

Logical Blocks:

1.1 Data Reception: Listens for outbound contact data from KlickTipp via webhook trigger.
1.2 Email Body Creation: Generates a personalized HTML email template based on the received data.
1.3 Email Sending: Sends the personalized email using Gmail with OAuth2 authentication.
1.4 Delivery Status Update: Updates the contact in KlickTipp with the email delivery status and stores the sent HTML content.

2. Block-by-Block Analysis

1.1 Data Reception

Overview:
This block receives contact information from KlickTipp outbound rules, triggering the workflow when an event occurs (e.g., a tag applied to a contact). It captures essential fields such as email, first name, website, and phone.
Nodes Involved:
- Recieve the data from KlickTipp
Node Details:
- Recieve the data from KlickTipp
  - Type: KlickTipp Trigger
  - Role: Webhook trigger node listening for KlickTipp outbound events.
  - Configuration: Uses KlickTipp API credentials. No extra parameters set; relies on an internal webhook ID to listen for data.
  - Expressions/Variables: Outputs JSON with contact fields (e.g., email, CustomFieldFirstName, CustomFieldWebsite, CustomFieldPhone).
  - Input: External HTTP webhook call from KlickTipp.
  - Output: Passes received contact data downstream.
  - Version Requirements: Uses community KlickTipp node, version 1.
  - Edge Cases:
    - Missing or malformed payload from KlickTipp could cause missing fields.
    - Webhook authorization or connectivity issues with KlickTipp API.
    - The workflow depends on correct webhook configuration in KlickTipp outbound rules.
  - Sub-workflow: None.

1.2 Email Body Creation

Overview:
Generates a clean, brandable HTML email body personalized with contact data fields using embedded expressions.
Nodes Involved:
- Generate HTML template
Node Details:
- Generate HTML template
  - Type: HTML Node
  - Role: Constructs the HTML layout for the transactional email, embedding dynamic contact data via expressions.
  - Configuration: Contains a full HTML template with inline CSS styling. Uses expressions such as {{ $json.CustomFieldFirstName || 'there' }}, {{ $json.CustomFieldWebsite }}, and {{ $json.CustomFieldPhone }} to personalize content.
  - Input: Contact JSON from "Recieve the data from KlickTipp" node.
  - Output: Passes generated HTML in html field downstream.
  - Version Requirements: Supports version 1.2 for HTML node.
  - Edge Cases:
    - If expected custom fields are missing or empty, fallbacks like 'there' are used for greetings.
    - Malformed HTML or expression errors could cause invalid message bodies.
  - Sub-workflow: None.

1.3 Email Sending

Overview:
Sends the personalized HTML email to the contact’s email address via Gmail with OAuth2 authentication, handling success and failure paths.
Nodes Involved:
- Send an email
Node Details:
- Send an email
  - Type: Gmail Node
  - Role: Sends the generated email with Gmail OAuth2 credentials.
  - Configuration:
    - sendTo: Email address from KlickTipp data (={{ $('Recieve the data from KlickTipp').item.json.email }}).
    - message: HTML body from Generate HTML template (={{ $json.html }}).
    - subject: Hardcoded "Thank you!".
    - options: Sender name set as "KlickTipp team", no attribution appended.
    - On error: configured to continue workflow by outputting error for downstream handling.
  - Input: Receives HTML from "Generate HTML template" and email from "Recieve the data from KlickTipp".
  - Output: On success, triggers "Email delivery status: Sent"; on failure, triggers "Email delivery status: Failed".
  - Version Requirements: Uses Gmail node version 2.1.
  - Edge Cases:
    - OAuth2 credential errors (expired, invalid).
    - Gmail API rate limits or quota exceeded.
    - Network timeouts or connectivity issues.
    - Invalid email addresses causing sending failures.
  - Sub-workflow: None.

1.4 Delivery Status Update

Overview:
Updates the KlickTipp subscriber record with the email delivery status ("Sent" or "Failed") and stores the HTML body of the sent message for traceability.
Nodes Involved:
- Email delivery status: Sent
- Email delivery status: Failed
Node Details:
- Email delivery status: Sent
  - Type: KlickTipp Node (Update subscriber)
  - Role: Writes back the status "Sent" and the HTML email body to specified custom fields in KlickTipp on successful email delivery.
  - Configuration:
    - Updates two custom fields: one with value "Sent", another with the HTML content from "Generate HTML template".
    - Lookup subscriber by email from KlickTipp data.
  - Input: Triggered on successful email send.
  - Output: Terminal node (no downstream).
  - Version Requirements: KlickTipp node version 3.
  - Edge Cases:
    - API call failure to KlickTipp (network, authentication).
    - Subscriber not found or email mismatch.
- Email delivery status: Failed
  - Type: KlickTipp Node (Update subscriber)
  - Role: Writes back the status "Failed" and the HTML email body to KlickTipp custom fields if email sending fails.
  - Configuration: Same as above but sets status to "Failed".
  - Input: Triggered on email send error.
  - Output: Terminal node.
  - Version Requirements: KlickTipp node version 3.
  - Edge Cases:
    - Same as Sent node, plus possible race conditions if multiple failure updates occur.
    - Email sending failures might not have detailed error messages in KlickTipp; logs must be checked.

3. Summary Table

Node Name	Node Type	Functional Role	Input Node(s)	Output Node(s)	Sticky Note
Recieve the data from KlickTipp	KlickTipp Trigger	Receives outbound contact data from KlickTipp webhook	None	Generate HTML template	Community Node Disclaimer: This workflow uses KlickTipp community nodes. See block 1.1 description for details.
Generate HTML template	HTML Node	Builds personalized HTML email body	Recieve the data from KlickTipp	Send an email	Provides a clean, brandable HTML template with fallback for missing fields. See block 1.2 for details.
Send an email	Gmail Node	Sends email via Gmail OAuth2	Generate HTML template	Email delivery status: Sent, Email delivery status: Failed	Sends email with error continuation to handle status update. See block 1.3 for details.
Email delivery status: Sent	KlickTipp Update Subscriber	Updates KlickTipp contact with "Sent" status and stores email HTML	Send an email (on success)	None	Updates status field in KlickTipp on successful email delivery. See block 1.4 for details.
Email delivery status: Failed	KlickTipp Update Subscriber	Updates KlickTipp contact with "Failed" status and stores email HTML	Send an email (on failure)	None	Updates status field in KlickTipp on failed email delivery. See block 1.4 for details.
Sticky Note	Sticky Note	Provides workflow description and disclaimers	None	None	Community Node Disclaimer and workflow summary.
Sticky Note1	Sticky Note	Labels block 2: Create email body	None	None	Label for block 1.2.
Sticky Note2	Sticky Note	Labels block 3: Send an email	None	None	Label for block 1.3.
Sticky Note3	Sticky Note	Labels block 4: Update status	None	None	Label for block 1.4.
Sticky Note4	Sticky Note	Labels block 1: Get data	None	None	Label for block 1.1.

4. Reproducing the Workflow from Scratch

Create a new workflow in n8n.
Add the KlickTipp Trigger node:
- Node Type: KlickTipp Trigger (community node)
- Credentials: Connect with your KlickTipp API credentials (OAuth/API key as per your setup).
- Configuration: Default webhook, no parameters needed. This node listens to outbound events from KlickTipp.
- Position: Start of the workflow.
- Purpose: Receive contact data (email, first name, phone, website, etc.) when KlickTipp outbound rule triggers.

Add an HTML node to generate the email body:

Node Type: HTML Node
Connect input from the KlickTipp Trigger node.

Configuration: Paste the following HTML template into the HTML field (replace placeholders with expressions):

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Thank You</title>
  <style>
    body {
      margin: 0;
      padding: 16px;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 14px;
      color: #111111;
      background: #f5f5f5;
    }
    .wrapper {
      max-width: 600px;
      margin: 0 auto;
      background: #ffffff;
      padding: 20px;
      border-radius: 6px;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
    }
    h2.title {
      margin: 0 0 12px 0;
      font-size: 20px;
      font-weight: bold;
      color: #2c3e50;
    }
    p {
      margin: 0 0 10px 0;
    }
    a {
      color: #1155cc;
      text-decoration: underline;
    }
    .contact-info {
      margin: 15px 0;
    }
    .footer {
      margin-top: 20px;
    }
  </style>
</head>
<body>
  <div class="wrapper">
    <h2 class="title">Thank you for using KlickTipp!</h2>
    <p>Hello {{ $json.CustomFieldFirstName || 'there' }},</p>
    <p>We appreciate your trust in KlickTipp. Your account details have been updated successfully.</p>
    <div class="contact-info">
      <p><strong>Website:</strong> <a href="{{ $json.CustomFieldWebsite }}">{{ $json.CustomFieldWebsite }}</a></p>
      <p><strong>Phone:</strong> {{ $json.CustomFieldPhone }}</p>
    </div>
    <p>If you have any questions, feel free to reply to this email — we’re here to help!</p>
    <p class="footer">Best regards,<br>The KlickTipp Team</p>
  </div>
</body>
</html>

Version: Use at least version 1.2 of HTML node.
Output: The HTML content will be passed downstream.

Add Gmail node to send the email:
- Node Type: Gmail Node
- Connect input from the HTML node.
- Credentials: Set up and choose Gmail OAuth2 credentials with Send Email scope.
- Configuration:
  - Send To: Expression: ={{ $('Recieve the data from KlickTipp').item.json.email }}
  - Message: Expression: ={{ $json.html }}
  - Subject: "Thank you!"
  - Options:
    - Sender Name: "KlickTipp team"
    - Append Attribution: false
  - On Error: Set to "Continue on Error" to handle failures gracefully.
- Version: Use Gmail node version 2.1 or newer.
Add KlickTipp update subscriber node for success status:
- Node Type: KlickTipp Update Subscriber (Community node)
- Connect input from Gmail node's success output.
- Credentials: KlickTipp API credentials.
- Configuration:
  - Operation: Update subscriber.
  - Lookup by email: ={{ $('Recieve the data from KlickTipp').item.json.email }}
  - Custom Fields to update:
    - Email delivery status field (e.g., field222442): set value "Sent"
    - HTML body field (e.g., field222482): set value ={{ $('Generate HTML template').item.json.html }}
- Version: KlickTipp node version 3.
Add KlickTipp update subscriber node for failure status:
- Node Type: KlickTipp Update Subscriber (Community node)
- Connect input from Gmail node's error output.
- Credentials: Same KlickTipp API credentials.
- Configuration:
  - Operation: Update subscriber.
  - Lookup by email: ={{ $('Recieve the data from KlickTipp').item.json.email }}
  - Custom Fields to update:
    - Email delivery status field (e.g., field222442): set value "Failed"
    - HTML body field (e.g., field222482): set value ={{ $('Generate HTML template').item.json.html }}
- Version: KlickTipp node version 3.
Add Sticky Notes (optional) for readability:
- Place sticky notes labeling each block:
  - "1. Get data."
  - "2. Create an email body."
  - "3. Send an email."
  - "4. Update email delivery status."
  - Add a detailed community disclaimer note explaining workflow purpose, features, and setup instructions.
Activate the workflow and test:
- Apply a test tag or trigger the outbound rule in KlickTipp to send sample data to the webhook.
- Verify email receipt and KlickTipp field updates.
- Monitor workflow execution logs for any errors or warnings.

5. General Notes & Resources

Note Content	Context or Link
Community Node Disclaimer: This workflow uses KlickTipp community nodes which require installation and API credential setup. The workflow automates transactional emails from KlickTipp to Gmail with personalized HTML templates and delivery status feedback. It supports dynamic field mapping and is flexible for various use cases like confirmations, welcomes, and announcements.	Included as a sticky note in the workflow and summarized in the overview.
Setup Instructions: Configure KlickTipp API credentials and Gmail OAuth2 credentials with proper scopes. Import or paste the HTML template for branding and personalization. Activate the workflow and link it to KlickTipp outbound rules to trigger automatically on tag application or other events.	See sticky note and step 4 reproduction instructions.
Testing: Use a test contact in KlickTipp and apply the outbound rule to trigger the workflow. Confirm email delivery and status field updates. Check execution logs for troubleshooting.	Internal best practice for deployment.
Customization: The HTML template can be modified for branding, include CC/BCC or attachments in Gmail node as needed, and extend to support plain-text alternatives for better deliverability.	Flexible for future enhancements.
Helpful Links: For KlickTipp nodes and community support, refer to the n8n community forums and official KlickTipp API docs. Gmail OAuth2 credential setup is documented in n8n’s credential guides.	https://community.n8n.io/ and https://docs.n8n.io/

This reference enables deep understanding, reproduction, and troubleshooting of the "Automated KlickTipp to Gmail: Send Transactional Emails" workflow with clear segmentation by functional role and node-level detail.

20 KiB Raw Permalink Blame History Unescape Escape