=== BreznFlow === Contributors: noschmarrn Tags: n8n, workflow, automation, diagram, svg Requires at least: 6.0 Tested up to: 6.9 Stable tag: 1.0.1 Requires PHP: 8.0 License: GPLv2 or later License URI: https://www.gnu.org/licenses/gpl-2.0.html Visually display n8n automation workflows in posts and pages with an interactive SVG diagram, node detail panel, and automatic sensitive data masking. == Description == BreznFlow lets you embed beautiful, interactive diagrams of your n8n automation workflows into WordPress posts and pages. **Key Features:** * **Interactive SVG Diagram** — zoom, pan, and click nodes to see their configuration * **Node Detail Panel** — click any node to see its parameters below the diagram * **Sensitive Data Masking** — API keys, tokens, and secrets in URL parameters are automatically replaced with [REDACTED] before storage * **Node Type Registry** — 80+ node types with brand colors and icons (OpenAI, Slack, GitHub, and more) * **InfoBox** — shows "3x HTTP Request, 2x Code" node summary * **AI Detection** — automatically detects and badges AI-powered workflows * **Multiple Display Modes** — visual (diagram), info (node counts only), compact (diagram without toolbar) * **Shortcode System** — `[breznflow id="X"]` with per-shortcode attribute overrides * **Download Button** — let visitors download the sanitized (masked) JSON * **3-Step Import Wizard** — paste JSON, configure display, preview and publish * **Related Workflows** — shows similar workflows by shared node types * **View Counting** — tracks how many times each workflow has been displayed * **Zero Dependencies** — vanilla JavaScript, no external CDN, no tracking **How to use:** 1. Go to BreznFlow → Add Workflow 2. Paste your n8n workflow JSON export (or upload a .json file) 3. Configure display settings 4. Preview the diagram and publish 5. Add `[breznflow id="X"]` to any post or page **Security:** BreznFlow never stores your raw workflow JSON. Before saving, it validates the JSON against the n8n schema, sanitizes all strings, and masks detected secrets (API keys in URL parameters, high-entropy condition values). The stored JSON is always the sanitized version. JavaScript code in Code nodes (`jsCode`) is displayed as plain text and is never executed in the browser. == Installation == 1. Upload the `breznflow` folder to `/wp-content/plugins/` 2. Activate the plugin in WordPress admin 3. Go to BreznFlow in your admin menu 4. Add your first workflow via the 3-step wizard == Frequently Asked Questions == = Where do I get a workflow JSON? = In n8n, open your workflow and use the menu: Workflow → Export → Download JSON. = Are my API keys safe? = BreznFlow automatically detects and replaces common secret patterns (API keys in URL parameters, high-entropy condition values) with `[REDACTED]` before storing. The masking log in the wizard shows exactly what was masked and why. JavaScript code in Code nodes is NOT automatically scanned — review it manually before publishing. = Can I embed multiple workflows on one page? = Yes. Use `[breznflow id="1"]`, `[breznflow id="2"]`, etc. The JavaScript is loaded only once regardless of how many shortcodes are on the page. = What n8n version is supported? = The plugin was developed against n8n workflow JSON exports and supports the standard export format. It has been tested with workflows from n8n 1.x. = Can visitors download the workflow JSON? = Yes, if you enable the download option. Only the sanitized (masked) JSON is available for download — never the original. == External Services == This plugin optionally connects to external services if you choose to use the "Import from URL" feature in the workflow import wizard. = Import from URL = If you choose to import a workflow by pasting a URL instead of uploading or pasting JSON directly, the plugin will make an HTTP request to that URL using WordPress's built-in `wp_remote_get()` function. * **When:** Only when you click the "Fetch" button in the Add Workflow wizard * **What is sent:** Only the URL you provide — no WordPress data, no user data * **To whom:** Whatever server hosts the URL you provide * **Privacy policy:** Depends on the server you connect to No data is transmitted automatically. No data is sent during normal page loads or to visitors browsing your site. For security, requests to private/internal network addresses (localhost, LAN ranges, cloud metadata endpoints) are blocked. == Screenshots == 1. 3-step import wizard — Step 1: paste or upload your n8n JSON 2. Step 2: configure display settings and preview the shortcode 3. Step 3: live SVG preview with security masking summary 4. Frontend diagram with node detail panel open 5. Compact mode showing only the node info box 6. Workflow list in admin with shortcode copy button == Changelog == = 1.0.0 = * Interactive SVG renderer with zoom, pan, and node detail panel * 3-step import wizard with JSON validation and sensitive data masking * 80+ node type registry with brand colors and icons * Shortcode `[breznflow]` with mode, zoom, and display attributes * Auto-fit zoom for large workflows (configurable threshold) * Minimap toggle per workflow and via shortcode attribute * 5 built-in themes (Dark, Light, Minimal, Tech, Brezn) plus custom theme import * Action bar with share, embed, get JSON, and download buttons * Embed handler for standalone iframe embedding * Download handler for sanitized JSON export * Sensitive data masking (API keys, tokens, secrets) with mask log * View counter and related workflows by shared node types * Schema.org HowTo structured data support * Zero dependencies — vanilla JavaScript, no external CDN, no tracking == Upgrade Notice == = 1.0.0 = Initial release.