mifupa

BreznFlow turns n8n workflow JSON exports into interactive, zoomable SVG diagrams inside WordPress. Paste your workflow, and the plugin renders every node with brand-accurate colors, connection lines, and clickable detail panels — directly in your posts and pages.
The plugin was built for mifupa.com, a personal blog where n8n automations are documented regularly. Screenshots get outdated. Embedding the n8n editor is impractical. BreznFlow solves this: one shortcode, one interactive diagram, zero external dependencies.
<h4>At a glance</h4>
<ul>
<li>Renders n8n workflow JSON as interactive SVG diagrams with zoom, pan, and click</li>
<li>86 node types with brand-accurate colors and icons (OpenAI, Slack, GitHub, Telegram, and more)</li>
<li>Click any node to inspect its parameters in a detail panel below the diagram</li>
<li>Automatically masks API keys, tokens, and secrets before storage — the raw JSON is never saved</li>
<li>3-step import wizard: paste JSON, configure display, preview and publish</li>
<li>5 built-in themes (Dark, Light, Minimal, Tech, Brezn) plus custom theme import</li>
<li>Shortcode <code>[breznflow id="X"]</code> with 13 attributes for per-instance configuration</li>
<li>Action bar with share, embed, get JSON, and download actions</li>
<li>Standalone embed page for iframe integration</li>
<li>Related workflows by shared node types</li>
<li>View counter and AI detection badges</li>
<li>Zero dependencies — vanilla JavaScript, no external CDN, no tracking</li>
</ul>
<h4>What makes BreznFlow different</h4>
<ul>
<li>No external services. Everything runs locally inside WordPress. No CDN, no SaaS, no API calls during page loads.</li>
<li>Security first. Sensitive data (API keys, tokens, secrets) is automatically detected and replaced with <code>[REDACTED]</code> before storage. The raw workflow JSON is never saved.</li>
<li>Real interactivity. Not a static image — visitors can zoom, pan, and click nodes to see their configuration.</li>
<li>Vanilla JavaScript. No React, no jQuery, no build step. The renderer is a single JS file that generates SVG elements directly.</li>
<li>Built for real sites. Running on the developer’s own production sites since version 1.0.</li>
</ul>
<h4>Display modes</h4>
<ul>
<li>Visual — full diagram with toolbar, detail panel, and action bar</li>
<li>Info — node counts only (InfoBox summary like “3× HTTP Request, 2× Code”) — no diagram</li>
<li>Compact — diagram without toolbar or action bar</li>
</ul>
<h4>Theme system</h4>
5 built-in themes: Dark (default), Light, Minimal, Tech, and Brezn. Custom themes can be imported as <code>.breznflow.json</code> files containing 41 CSS color tokens. Themes are selectable globally, per workflow, or per shortcode.
<h4>Node type registry</h4>
86 predefined node types across 10 categories: Triggers, Core Logic, Data Transformation, Databases, Communication, Google, Dev Tools, AI, Storage, and CRM/Marketing. Unknown node types get a deterministic fallback with auto-generated colors — the same unknown type always looks the same.
<h4>Sensitive data masking</h4>
Before saving, BreznFlow runs a two-pass sanitization:
<ol>
<li>All strings pass through WordPress sanitization</li>
<li>Secret detection scans for API keys in URL parameters, sensitive header values (Authorization, Bearer, X-API-Key), and high-entropy condition values</li>
</ol>
A masking log records every redaction with reason and context — visible in the wizard preview.
<h4>Action bar</h4>
Below the diagram, the action bar provides four configurable actions:
<ul>
<li>Share — article link and anchor link for hash navigation</li>
<li>Embed — iframe embed code for standalone embedding</li>
<li>Get JSON — formatted JSON display with file size</li>
<li>Download — sanitized JSON file download</li>
</ul>
Each action can be enabled/disabled globally, per workflow, or per shortcode. Embed and Download use dual-gate security (global setting AND per-post permission).
<h3>External Services</h3>
This plugin optionally connects to external services only when you explicitly use the “Import from URL” feature in the workflow import wizard.
<h4>Import from URL</h4>
If you choose to import a workflow by pasting a URL instead of uploading or pasting JSON directly, the plugin makes an HTTP request to that URL using WordPress’s built-in <code>wp_remote_get()</code> function.
<ul>
<li>When: Only when you click the “Fetch” button in the Add Workflow wizard</li>
<li>What is sent: Only the URL you provide — no WordPress data, no user data, no cookies</li>
<li>To whom: Whatever server hosts the URL you provide</li>
<li>Privacy policy: Depends on the server you connect to</li>
</ul>
No data is transmitted automatically. No data is sent during normal page loads or to visitors browsing your site.
For security, requests to private and internal network addresses are blocked: localhost, <code>127.0.0.0/8</code>, <code>10.0.0.0/8</code>, <code>172.16.0.0/12</code>, <code>192.168.0.0/16</code>, and cloud metadata endpoints (e.g. <code>169.254.169.254</code>).

BreznFlow

Display n8n workflows as interactive SVG diagrams with zoom, pan, node details, and automatic secret masking.

Maidul

Easily integrate Contact Form 7 with multiple messaging platforms and automation tools to receive instant notifications and trigger powerful workflows.
This plugin enhances your website’s communication strategy by allowing you to receive form submissions as real-time messages in WhatsApp, Telegram, Microsoft Teams, and trigger unlimited automation via N8N. It is ideal for business owners, customer support teams, and marketers who want to ensure no lead or customer inquiry goes unnoticed.
With seamless API integrations, you can automatically forward CF7 submissions to your chosen messaging platforms or automation workflows, helping you improve responsiveness, user satisfaction, and operational efficiency.
Use Cases: 
– Receive order inquiries or contact requests instantly in your Telegram group or WhatsApp inbox 
– Enable real-time alerts for support or sales teams 
– Track form submissions on mobile even when away from the dashboard 
– Route different forms to different departments (sales, support, HR) 
– Trigger complex workflows with N8N automation 
– Integrate with CRM, Google Sheets, Slack, and more via N8N
Features:
<ul>
<li>4 Integration Options: WhatsApp, Telegram, Microsoft Teams, and N8N automation</li>
<li>Real-time Messaging: Instantly send Contact Form 7 form data to multiple platforms</li>
<li>WhatsApp Cloud API: Integration with Meta/Facebook Cloud API</li>
<li>Telegram Bot API: Support with customizable chat ID and bot token for personal/group chats</li>
<li>Microsoft Teams: Incoming Webhook integration for channel notifications</li>
<li>N8N Automation: Send complete JSON data to N8N for unlimited workflow possibilities</li>
<li>Per-Form Routing: Configure different destinations for specific forms</li>
<li>Global Settings: Set default recipients for all forms</li>
<li>Modern Admin Interface: Beautiful, intuitive settings page with comprehensive setup guides</li>
<li>Extensive Documentation: Step-by-step instructions for each platform</li>
<li>Error Logging: Built-in debugging for troubleshooting</li>
<li>Lightweight & Fast: Optimized for performance</li>
<li>Translation Ready: Full i18n support</li>
<li>Developer Friendly: Extensive hooks and filters for customization</li>
</ul>
<h3>External Services</h3>
This plugin connects to external APIs in order to send form submission notifications via WhatsApp and Telegram.
WhatsApp Cloud API (Meta/Facebook) 
Used to send form submissions to WhatsApp recipients. 
– Service URL: https://graph.facebook.com 
– What is sent: The recipient’s phone number ID, access token, and message content derived from the submitted form fields. 
– When: Each time a Contact Form 7 form is submitted. 
– Terms of Service: https://www.facebook.com/legal/terms 
– Privacy Policy: https://www.facebook.com/about/privacy
Telegram Bot API 
Used to send form submissions to a Telegram chat via bot. 
– Service URL: https://api.telegram.org 
– What is sent: The bot token, chat ID, and message content derived from the submitted form fields. 
– When: Each time a Contact Form 7 form is submitted. 
– Terms of Service: https://core.telegram.org/terms 
– Privacy Policy: https://telegram.org/privacy
Microsoft Teams Incoming Webhook 
Used to send form submissions to Microsoft Teams channels. 
– Service URL: https://webhook.office.com (or outlook.office.com, outlook.office365.com) 
– What is sent: Message content derived from the submitted form fields. 
– When: Each time a Contact Form 7 form is submitted (if configured). 
– Terms of Service: https://www.microsoft.com/en-us/servicesagreement 
– Privacy Policy: https://privacy.microsoft.com/en-us/privacystatement
N8N Automation (Self-Hosted or Cloud) 
Used to send complete form data to N8N workflow webhooks for automation. 
– Service URL: Your N8N instance URL (self-hosted or n8n.cloud) 
– What is sent: Complete JSON payload including form ID, timestamp, site URL, and all form field data. 
– When: Each time a Contact Form 7 form is submitted (if configured). 
– Terms of Service: https://n8n.io/legal/terms (if using n8n.cloud) 
– Privacy Policy: https://n8n.io/legal/privacy (if using n8n.cloud) 
– Note: Self-hosted N8N instances are under your control and privacy policy.
<h3>License</h3>
This plugin is licensed under the GPLv2 or later.

Chat Notifications for Telegram with CF7

Instantly send Contact Form 7 submissions to WhatsApp, Telegram, Microsoft Teams, and N8N for real-time alerts and automation.

BreznFlow vs Chat Notifications for Telegram with CF7