
內容簡介
CanaryBlue Diagrams for Mermaid 是一款為 WordPress 編輯器新增 Mermaid 圖表區塊的外掛,使用者可以輸入 Mermaid 語法,並即時預覽,無需依賴外部 CDN,即可發佈可存取的 SVG 圖表。
【主要功能】
• 編輯器中的即時 Mermaid 預覽
• 儲存的 Mermaid 來源前端渲染一致
• 提供多種主題選擇(預設、中性、黑暗、森林)
• 可編輯的可存取標籤供螢幕閱讀器使用
• 寬版與全版對齊及 WordPress 間距控制
• JavaScript 不可用時的可讀來源回退
外掛標籤
開發者團隊
② 後台搜尋「CanaryBlue Diagrams for Mermaid」→ 直接安裝(推薦)
原文外掛簡介
CanaryBlue Diagrams for Mermaid adds a Mermaid Diagram block to the WordPress editor. Enter Mermaid syntax, see a debounced live preview, choose a theme, and publish an accessible SVG diagram without depending on an external CDN.
Mermaid is an independent open-source project. CanaryBlue Diagrams for Mermaid is developed by CanaryBlue and is not affiliated with or endorsed by the Mermaid project.
Features:
Live Mermaid preview in the block editor.
Matching front-end rendering from the saved Mermaid source.
Default, Neutral, Dark and Forest themes.
An editable accessible label for screen readers.
Wide and full alignment plus WordPress spacing controls.
Readable source fallback if JavaScript is unavailable or rendering fails.
Mermaid 11.16.1 bundled locally with strict security mode.
A capability-gated Mermaid administration page with version, documentation and support details.
Documentation: https://canaryblue.org/docs/public/diagrams/
Support: https://wordpress.org/support/plugin/canaryblue-diagrams-for-mermaid
Source code: https://forge.canaryblue.org/CanaryBlue-Public/Diagrams-Free
Mermaid syntax reference: https://mermaid.js.org/intro/syntax-reference.html
The Free edition is supported through the WordPress.org forum and does not include a service-level agreement.
Development
This plugin uses a modern JavaScript build pipeline (Webpack + npm, through @wordpress/scripts) to generate the compiled assets found in the build/ directory.
To comply with the WordPress.org requirement for human-readable code, the uncompiled source is included in this package:
src/ — the readable ES modules, block metadata and stylesheets used to generate the production bundles in build/.
package.json — the pinned build toolchain (@wordpress/scripts 32.6.0) and the pinned Mermaid version.
Building from source, from the directory containing package.json:
npm install
npm run build
The complete repository, including build configuration, tests, contribution guidance and release workflows, is publicly available at:
https://forge.canaryblue.org/CanaryBlue-Public/Diagrams-Free
The only third-party library in the compiled output is Mermaid 11.16.1, which is MIT licensed. Its notice is in THIRD-PARTY-NOTICES.txt and its own unminified source is published by the Mermaid project at:
https://github.com/mermaid-js/mermaid
The exact bundled version is tagged there as [email protected]:
https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.16.1
Third-Party Services
The plugin does not contact a third-party service to render diagrams. Mermaid 11.16.1 is bundled locally and is licensed under the MIT License. See THIRD-PARTY-NOTICES.txt in the plugin package.
