Description
n8n-nodes-google-chat-cards-v2
This is an n8n community node that lets you create rich, interactive Google Chat messages using the Cards v2 API with a visual builder interface.
Features
- ๐จ Visual Card Builder – Create cards without writing JSON
- ๐ Simple Mode – Quick cards with basic elements (header, text, buttons)
- ๐ง JSON Mode – Full control with raw JSON input for advanced users
- ๐ฏ Rich Widgets Support:
- Text with formatting
- Images with click actions
- Buttons with custom actions
- Decorated text with icons
- Grids for organized layouts
- Text inputs for user feedback
- Selection inputs (dropdown, radio, checkbox)
- Dividers for visual separation
- ๐งต Thread Support – Group messages in conversations
- โก Dual Authentication – OAuth2 or Webhook URL
Installation
In n8n
- Go to Settings > Community Nodes
- Search for
n8n-nodes-google-chat-cards-v2 - Click Install
Manual Installation
npm install n8n-nodes-google-chat-cards-v2
Then restart your n8n instance.
Setup
Option 1: Webhook URL (Simple)
-
Get Webhook URL:
- Open your Google Chat space
- Click on the space name > "Manage webhooks"
- Create a new webhook and copy the URL
-
Configure in n8n:
- Select "Webhook URL (Simple)" as authentication method
- Paste your webhook URL
- Start sending messages!
Option 2: OAuth2 (Advanced)
-
Google Cloud Console Setup:
- Go to Google Cloud Console
- Create a new project or select existing
- Enable the Google Chat API
-
Create OAuth2 Credentials:
- Go to APIs & Services > Credentials
- Click "Create Credentials" > "OAuth client ID"
- Choose "Web application"
- Add authorized redirect URI:
https://your-n8n-instance.com/rest/oauth2-credential/callback
-
Configure OAuth Consent Screen:
- Add required scopes:
https://www.googleapis.com/auth/chat.messages
- Add required scopes:
-
n8n Credentials Setup:
- In n8n, go to Credentials
- Create new Google Chat OAuth2 API credential
- Enter your Client ID and Client Secret
- Authenticate with Google
Usage
Simple Mode
Perfect for quick notifications and basic messages:
- Select Simple Card mode
- Add optional header with title and image
- Enter your main message text
- Add buttons for actions
- Include additional widgets as needed
Example Simple Card:
- Header: "Deployment Complete โ "
- Text: "Your application has been successfully deployed to production."
- Button: "View Application" โ Opens URL
JSON Mode
For advanced users who need full control:
- Select JSON Input mode
- Enter complete Cards v2 JSON structure
- Reference Google Chat Cards API
Example JSON:
{
"cardsV2": [
{
"card": {
"header": {
"title": "Custom Card",
"subtitle": "With full JSON control"
},
"sections": [
{
"widgets": [
{
"textParagraph": {
"text": "Your custom content here"
}
}
]
}
]
}
}
]
}
Supported Widgets
Text Paragraph
Basic text content with optional markdown formatting.
Images
Display images with optional click actions to open URLs.
Decorated Text
Text with icons, top/bottom labels for rich information display.
Buttons
Interactive buttons that can:
- Open URLs
- Trigger custom actions with parameters
Grid (v0.2.0)
Display items in an organized grid layout with:
- Configurable columns
- Image support
- Title and subtitle for each item
Text Input (v0.2.0)
Collect user input with:
- Single or multi-line text fields
- Labels and hints
- Initial values
Selection Input (v0.2.0)
Provide selection options:
- Dropdown menus
- Radio buttons
- Checkboxes
- Multi-select support
Dividers
Visual separators between content sections.
Examples
Deployment Notification
// Simple Mode Configuration
{
"buildMode": "simple",
"simpleHeader": {
"title": "Deployment Status",
"subtitle": "Production Environment",
"imageUrl": "https://example.com/deploy-icon.png",
"imageType": "CIRCLE"
},
"simpleText": "Version 2.1.0 has been successfully deployed",
"simpleButtons": [
{
"text": "View Changes",
"actionType": "openLink",
"url": "https://github.com/repo/releases"
}
]
}
Alert Message
// Simple Mode with Decorated Text
{
"buildMode": "simple",
"simpleText": "System alert triggered",
"simpleWidgets": {
"decoratedText": [
{
"text": "CPU Usage: 95%",
"topLabel": "Alert Type",
"bottomLabel": "Immediate attention required",
"icon": "CLOCK"
}
]
}
}
Feedback Form (v0.2.0)
// Using new input widgets
{
"buildMode": "simple",
"simpleText": "Please provide your feedback",
"simpleWidgets": {
"textInput": [
{
"name": "feedback",
"label": "Your Comments",
"multiline": true,
"hintText": "Tell us what you think"
}
],
"selectionInput": [
{
"name": "rating",
"label": "Rate our service",
"type": "dropdown",
"items": [
{"text": "Excellent", "value": "5"},
{"text": "Good", "value": "4"},
{"text": "Average", "value": "3"}
]
}
]
}
}
Limitations
- Google Chat supports limited markdown (bold, italic, strikethrough)
- Images must be HTTPS URLs
- Maximum 100 widgets per card
- Some advanced Cards v2 features may require JSON mode
Changelog
v0.2.2 (Latest)
- โ Fixed Grid widget to use Items instead of confusing Rows/Cells structure
- โ Grid items now support title, subtitle, image, and click actions
- โ Clearer UI that explains items auto-arrange into rows based on columns
v0.2.1
- โ Fixed webhook 503 error by changing request method
v0.2.0
- โ Added webhook URL authentication method
- โ New Grid widget for organized layouts
- โ Text Input widget for user feedback
- โ Selection Input widget (dropdown, radio, checkbox)
- โ Enhanced Simple Mode with more widget types
v0.1.0
- Initial release with OAuth2 authentication
- Simple and JSON modes
- Basic widgets support
Roadmap
Future enhancements planned:
- ๐จ Full visual builder with drag-and-drop
- ๐ Template library for common use cases
- ๐ Card preview before sending
- ๐ฏ Advanced action handlers
- ๐ง Webhook response handling
Resources
License
MIT
Author
Jeremy Dawes – Jezweb
Contributing
Contributions are welcome! Please feel free to submit a Pull Request.