[WordPress] 外掛分享： Markdown Renderer for GitHub

內容簡介

Markdown Renderer for GitHub 是一款專為 WordPress 設計的外掛，能將內容轉換為美觀的 GitHub Flavored Markdown (GFM) 格式，適合技術部落格、文件網站及需要專業程式碼展示的內容。

【主要功能】
• 美觀的語法高亮顯示
• 支援 Mermaid 圖表與互動功能
• 支援多種 Chart.js 圖表類型
• 完全兼容 GitHub Markdown
• 一鍵複製程式碼功能
• 性能優化，適合 WordPress

外掛標籤

開發者團隊

📦 歷史版本下載

1.0.01.1.01.1.11.1.21.3.01.3.21.3.61.3.81.3.91.4.01.6.01.7.01.7.21.7.31.7.41.7.51.7.71.7.81.7.91.8.01.9.01.9.12.0.12.0.22.0.32.2.02.3.02.4.12.5.02.6.02.7.02.7.12.7.22.7.32.7.42.7.52.7.62.7.72.7.82.8.02.8.12.9.02.9.12.9.22.9.32.9.4trunk1.10.01.10.21.11.01.11.11.13.01.14.01.14.11.7.101.7.111.7.121.7.131.7.142.10.02.10.12.10.22.10.32.10.42.10.52.7.112.7.132.7.142.7.17

原文外掛簡介

Markdown Renderer for GitHub brings GitHub Flavored Markdown (GFM) rendering to WordPress for technical blogs, documentation sites, tutorials, code portfolios, and developer resources. Add Markdown in the block editor or with the [gfmr_markdown] shortcode, then render code, tables, task lists, diagrams, and charts on the front end.
The free plugin includes:

GitHub Flavored Markdown rendering with tables, task lists, strikethrough, autolinks, and footnotes
Native grammars for 30+ programming languages, plus fallback handling for many more
GitHub Light, GitHub Dark, and system-aware code themes
Mermaid diagrams with interactive controls
8 chart types through Chart.js charts from chart fenced code blocks
Optional PlantUML rendering through a configured external PlantUML/Kroki server
Table of Contents, structured data, multilingual URL options, and server-side rendering controls
A built-in admin manual with Getting Started, Usage, FAQ, Troubleshooting, Support, and System Info tabs
WordPress Abilities API support on WordPress 6.9+ for AI agents such as Claude Code and Codex

A separate Pro add-on may provide advanced workflow features such as enhanced code-block options, custom themes, higher-level AI orchestration, and priority support. Core Markdown, syntax highlighting, Mermaid, Chart.js, PlantUML, and the basic settings are included in the free plugin.
Detailed user guidance is available inside the plugin settings screen after activation. This keeps the manual, FAQ, troubleshooting, support guidance, and non-secret system information close to the WordPress admin workflow without requiring a separate documentation website.
Technical Requirements

WordPress 6.8 or higher
PHP 8.2 or higher
Modern browser with JavaScript enabled
Recommended: 128MB+ PHP memory limit
Recommended: gzip or Brotli compression enabled for static JavaScript on your web server

Why server compression matters:
The syntax-highlighting and diagram libraries are large when uncompressed (Shiki ~2.35 MB, Mermaid ~3.2 MB) but shrink dramatically when delivered with gzip or Brotli (Shiki ~302 KB, Mermaid ~908 KB). For the best front-end performance, ensure your web server compresses static JavaScript (for example mod_deflate/mod_brotli on Apache, or the gzip/brotli directives on nginx). Most managed hosts and CDNs enable this by default. The plugin adds a Tools → Site Health check that reports whether these bundles are actually being served compressed.
Support
For support, please visit the WordPress.org support forum for this plugin. Our team actively monitors and responds to support requests.
Before posting a support request:
* Check the FAQ section above for common questions
* Ensure you’re using the latest version of the plugin
* Include your WordPress and PHP versions in your support request
Feature Requests:
We welcome feature suggestions! Please post them in the support forum with detailed descriptions of your use case.
Source Code
This plugin uses build tools for development efficiency.
Compressed File Source Code:
* build/index.js: WordPress Block Editor integration code
* Source: blocks/markdown/src/ folder
* Build: npm run build
* assets/libs/shiki/shiki.min.js: Shiki syntax highlighter (self-contained bundle, no CDN)
* Source: scripts/vendor/shiki-entry.mjs
* Build: npm run vendor:shiki
Source Code Access:
* GitHub Repository: https://github.com/my-biz-dev/markdown-renderer-for-github
* License: GPL v2 or later
* Development Branch: main
Build Instructions:
1. Install Node.js 22 LTS (see .nvmrc)
2. Install dependencies with npm install
3. Build with npm run build
4. Run tests with npm run test
Developer Resources:
* Development Environment Setup: See CLAUDE.md and docs/DEVELOPMENT.md
* Contributing: See CONTRIBUTING.md
* Build Process Details: See BUILD.md
Third Party Services
By default this plugin runs entirely on your own server. The core rendering libraries are bundled locally and make no external requests:

Shiki syntax highlighter – served from your WordPress installation (no CDN)
Mermaid diagram renderer – served from your WordPress installation (no CDN)
Chart.js chart renderer – served from your WordPress installation (no CDN)
markdown-it parser – bundled locally

Optional features that contact an external server (opt-in, off by default):
Two features can send diagram source to an external rendering server. Both are inactive until you explicitly enable, configure a server URL, and accept the in-plugin privacy notice:

PlantUML diagrams – PlantUML has no in-browser renderer, so the source of each “`plantuml block is sent to a PlantUML/Kroki server to produce the image.

Default server (configurable, or self-hostable): https://www.plantuml.com/plantuml
Service: PlantUML – https://plantuml.com/

Server-side Mermaid rendering (Kroki) – an optional mode that pre-renders Mermaid diagrams on a Kroki server for faster first paint. When enabled, the Mermaid source is sent to the configured server.

Default server (configurable, or self-hostable): https://kroki.io
Service: Kroki – https://kroki.io/

To keep diagram source private you can point either feature at a server you self-host. When both options are left in their default (disabled) state, no diagram data or any other content leaves your site.
Pro license validation (only if you activate a Pro license key):
This Free plugin ships the shared license-gating code used by the separate Pro plugin. If you install the Pro plugin and enter a license key, activating, deactivating, or periodically re-validating that key sends the license key (no diagram or post content) to the license server:

Service: Lemon Squeezy – https://www.lemonsqueezy.com/
Endpoint: https://api.lemonsqueezy.com/v1/licenses/

Without the Pro plugin and an activated license key, no request is made to this endpoint.
Privacy & Security Benefits (default configuration):
* No tracking, analytics, or data collection
* No data is transmitted to external servers unless you opt in to PlantUML or server-side Mermaid rendering, or activate a Pro license key
* Works offline and in closed networks with the default settings
Privacy
This plugin does not collect any personal data, and with the default settings all processing happens locally on your server. If you opt in to PlantUML or server-side (Kroki) Mermaid rendering, the source text of those diagrams is sent to the rendering server you configure – choose a server you trust, or self-host one, for sensitive content. If you activate a Pro license key, the key is sent to the Lemon Squeezy license server to validate it.
Credits

Syntax highlighting: Shiki
Diagram rendering: Mermaid
Chart rendering: Chart.js
Markdown parsing: markdown-it

Developer Information
This section provides essential information for developers who want to extend or customize the plugin.
For complete API documentation, architecture diagrams, and customization examples, see:
Developer Documentation on GitHub
Available Hooks and Filters
Actions:

gfmr_metadata_saved – Fired when code block metadata is saved

Parameters: $post_id (int), $metadata (array)
Use case: Sync metadata with external services, logging

Filters:

gfmr_metadata_get_metadata – Filter retrieved metadata before use

Parameters: $metadata (array), $post_id (int)
Use case: Custom language detection, metadata modification

gfmr_schema_data – Filter Schema.org JSON-LD data before output

Parameters: $schema (array), $post (WP_Post)
Use case: Add custom schema properties, author profiles

PHP Constants

GFMR_PLUGIN_FILE – Plugin main file path
GFMR_SLUG – Plugin slug (‘markdown-renderer-for-github’)
GFMR_URI – Plugin URL
GFMR_PATH – Plugin directory path
GFMR_PLUGIN_PATH – Plugin directory name (relative)
GFMR_PLUGIN_BASENAME – Plugin basename
GFMR_ASSETS_PATH – Assets directory URL

JavaScript Global Objects

wpGfmConfig – Plugin configuration object
wpGfmRenderer – Core rendering API (processCodeBlocks, renderContent, initialize)
wpGfmHighlighter – Highlighter wrapper instance
wpGfmShikiHighlighter – Actual Shiki highlighter instance
wpGfmUnifiedHighlight(code, lang, options) – Unified highlight function
wpGfmSwitchTheme(newTheme) – Theme switching function (‘light’, ‘dark’, ‘system’)
wpGfmRenderDiagram(content, element, options) – Diagram rendering function

Settings Option
Option name: gfmr_theme_settings
Available keys:

theme – Theme setting (‘light’, ‘dark’, ‘system’)
schema_enabled – Enable Schema.org JSON-LD output (bool)
schema_auto_detect_type – Auto-detect article type (bool)
schema_include_author – Include author in schema (bool)
schema_include_publisher – Include publisher in schema (bool)

Plugin Development
This plugin follows WordPress coding standards and provides clean, semantic HTML output.
Detailed Documentation:
For complete documentation including full API reference with code examples, architecture diagrams (Mermaid), step-by-step customization guides, and CSS class reference, visit:
GitHub Developer Documentation

延伸相關外掛