Markdown Renderer for GitHub

الوصف

Markdown Renderer for GitHub transforms your WordPress content with beautiful GitHub Flavored Markdown (GFM) rendering. Perfect for technical blogs, documentation sites, and any content that needs professional code presentation.

Key Features:

🎨 Beautiful Syntax Highlighting
* Powered by Shiki – the same syntax highlighter used by VS Code
* Support for 100+ programming languages
* Multiple beautiful themes (GitHub Light/Dark, VS Code themes, and more)
* Automatic language detection

📊 Mermaid Diagram Support
* Create flowcharts, sequence diagrams, and more
* Professional diagram rendering
* Interactive zoom functionality
* Error handling with user-friendly messages

📈 Chart.js Chart Support
* Create line, bar, pie, doughnut, and more chart types
* 8 chart types including scatter, bubble, radar, and Polar Area
* Simple JSON configuration in “`chart fenced code blocks
* Responsive and interactive charts

GitHub Flavored Markdown
* Tables, task lists, strikethrough
* Automatic URL linking
* Footnotes support
* 100% compatible with GitHub markdown

📋 Copy Button Feature
* One-click code copying
* GitHub-style user experience
* Full accessibility support
* Mobile-friendly design

Performance Optimized
* Asset lazy loading
* Minimal performance impact
* CDN-friendly architecture
* Optimized for WordPress

🌍 Developer Friendly
* Clean, semantic HTML output
* Extensive hooks and filters
* Translation ready (i18n)
* WordPress coding standards

Perfect for:
* Technical blogs and tutorials
* Documentation websites
* Code portfolios
* Educational content
* API documentation
* Developer resources

Technical Requirements

  • WordPress 6.5 or higher
  • PHP 8.2 or higher
  • Modern browser with JavaScript enabled
  • Recommended: 128MB+ PHP memory limit

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

Source Code Access:
* GitHub Repository: https://github.com/wakalab/markdown-renderer-for-github
* License: GPL v2 or later
* Development Branch: main

Build Instructions:
1. Install Node.js 18+
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

This plugin operates entirely self-contained and does NOT use any external third-party services.

Complete Local Operation:
* All JavaScript libraries are bundled locally within the plugin
* 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)
* No external API calls or network requests are made

Privacy & Security Benefits:
* No data is transmitted to external servers
* No tracking, analytics, or data collection
* No external dependencies that could compromise your site
* GDPR compliant by design
* Works offline and in closed networks

All functionality is fully self-contained within your WordPress installation with no external service dependencies.

Privacy

This plugin does not collect any personal data. All processing is done locally on your server.

Credits

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

المكوّنات

تقدّم هذه الإضافة مكوّن واحد (1).

  • Markdown Write in GitHub Flavored Markdown with real-time preview.

التنصيب

  1. Upload the plugin files to the /wp-content/plugins/markdown-renderer-for-github directory, or install the plugin through the WordPress plugins screen directly.
  2. Activate the plugin through the ‘Plugins’ screen in WordPress.
  3. Start using the Markdown block in the Gutenberg editor, or wrap your content with [gfm-renderer] shortcode.

الأسئلة المتكررّة

What is GitHub Flavored Markdown?

GitHub Flavored Markdown (GFM) is an extension of standard Markdown that includes features like tables, task lists, syntax highlighting, and automatic URL linking. It’s the same format used on GitHub.com.

Which programming languages are supported for syntax highlighting?

GitHub Flavored Markdown Renderer supports 100+ programming languages including JavaScript, Python, PHP, Java, C++, HTML, CSS, SQL, and many more. The highlighting is powered by Shiki, the same engine used by VS Code.

Can I create diagrams with this plugin?

Yes! You can create beautiful diagrams using Mermaid syntax, including:
* Flowcharts
* Sequence diagrams
* Class diagrams
* State diagrams
* Gantt charts
* And more

Can I create charts with this plugin?

Yes! You can create interactive charts using Chart.js with simple JSON configuration. Supported chart types
include:
* Line and Bar charts
* Pie and Doughnut charts
* Scatter, Bubble, Radar, and Polar Area charts

Simply use a “`chart fenced code block with your chart configuration in JSON format.

Is the plugin mobile-friendly?

Absolutely! All features including syntax highlighting, diagrams, and the copy button work perfectly on mobile devices.

Does this affect my site’s performance?

GitHub Flavored Markdown Renderer is designed for minimal performance impact with smart asset lazy loading and optimized code. Assets are only loaded when needed, and the plugin adds less than 100KB to your site.

Can I customize the appearance?

Yes, the plugin provides CSS variables and hooks for customization. You can easily match your theme’s design.

Is it translation ready?

Yes, the plugin is fully internationalized and translation ready. Japanese translation is included.

How do I add Markdown content?

You can use the dedicated “Markdown” block in the Gutenberg editor, or wrap your content with the [gfm-renderer] shortcode in classic editor.

Do I need coding knowledge to use this plugin?

Not at all! The plugin works with standard Markdown syntax that’s easy to learn. The Gutenberg block provides a user-friendly interface with live preview.

Will this work with my theme?

Yes, GitHub Flavored Markdown Renderer is designed to work with any properly coded WordPress theme. The styling is designed to integrate seamlessly with your site’s design.

المراجعات

لا توجد مراجعات لهذه الإضافة.

المساهمون والمطوّرون

“Markdown Renderer for GitHub” هو برنامج مفتوح المصدر. وقد ساهم هؤلاء الأشخاص بالأسفل في هذه الإضافة.

المساهمون

ترجمة ”Markdown Renderer for GitHub“ إلى لغتك.

مُهتم بالتطوير؟

تصفّح الشفرة، تحقق من مستودع SVN، أو الاشتراك في سجل التطوير بواسطة RSS.

سجل التغييرات

2.7.7

  • replace hardcoded ‘en’/’ja’ defaults with locale-aware fallback

2.7.6

  • add unified check commands for local quality verification
  • add Japanese comment check to preToolUse hook
  • speed up PR pipeline from 8-11min to 3-4min
  • extract GFMR_SVG_Utils trait and decode text entities after wp_kses
  • fix XSS regex to allow PlantUML guillemets and match innermost elements
  • fix HTTP 500 in editor preview caused by strip_tags stripping PlantUML syntax
  • restore wp_trigger_error() in GFMR_Renderer::log_debug()
  • address code review findings (W-2, W-3, S-1, S-3)
  • restore non-render public methods accidentally removed from GFMR_Settings
  • add missing require_once for refactored files in Pro bootstrap
  • resolve security test concurrency conflict in CI

2.7.5

  • add PNG response support for Ditaa diagrams
  • improve rendering reliability and cache performance
  • improve rendering performance and reliability
  • prevent Shiki from processing PlantUML blocks
  • add missing WP-Cron stubs and guard for wp_unschedule_hook
  • add wp_remote_get stub with test_remote_responses mock support
  • add get_error_message/code/data methods to WP_Error stub
  • fix WP_Error stub private property conflict with Exception

2.7.4

  • fix SVG fit-to-container and zoom quality issues

2.7.3

  • prevent wporg package from including coverage and docker files

2.7.1

  • add flag-only label style, language display order, and fix PlantUML direct mode
  • add missing Japanese translations for language display order settings
  • fix block editor sidebar translations not applying in Japanese locale
  • remove black border by replacing

<

pre> parent on render
* return null on SSR fetch failure to prevent URL display

2.7.0

  • add path-based URL routing for language-prefixed URLs
  • add global language switcher and fix path-based URL routing
  • add admin setting to toggle inline language switcher
  • parallelize rendering and add lazy loading
  • replace isset with array_key_exists to allow null check in SSR renderer
  • resolve race condition causing missed initial page render

2.6.0

  • Add Web Worker support for async syntax highlighting
  • Add PlantUML diagram support (Pro feature)
  • Add PlantUML privacy notice and settings UI
  • Add PlantUML SSR support with double-wrapping prevention
  • Add PlantUML SSR support with double-wrapping prevention
  • parallelize E2E and security jobs, fix ci-summary tracking
  • split test:quick into separate unit and lint steps
  • Accept lowercase region codes in language validation
  • Address code review findings for PR #396
  • Address code review findings for PR #396
  • address code review findings for CI/CD optimization
  • fix plugin activation timeout in global-setup and capture test exit code reliably
  • replace waitForLoadState with waitForURL for plugin activation
  • use Promise.all+waitForNavigation for plugin activation
  • add composer install to E2E job for plugin activation
  • Resolve PlantUML SVG arrow visibility and harden sanitization
  • Remove unreachable return statements after wp_send_json_error

2.5.0

  • Improve Docker/local development workflow and add frontend config filter
  • Fix image insertion in markdown editor with multilingual support
  • Add “Multilingual” translation entry to Japanese locale file

2.4.0

  • Add best practice configurations to Claude skills
  • Add automatic recovery for SVN update failures in wporg-deploy.sh
  • Support both “Related Linear Issue:” and “Related to Linear Issue:” patterns
  • Fix language tab switching in multilingual editor
  • Fix multilingual language switcher display on frontend
  • Initialize Chart and Multilingual handlers in Pro bootstrap
  • Fix language switcher selector to match multilingual-id attribute
  • Restore obsolete translations and add textdomain loading

2.3.0

  • Implement auto-close workflows and PR issue link validation for MD-220
  • Translate Japanese comments to English for WordPress.org distribution

2.2.0

  • Fix package size calculation on macOS by using du -sk instead of du -s

2.1.0

  • Filter out developer-only commits from changelog
  • Implement Chart.js integration for diagram rendering
  • Fix Mermaid diagram text clipping (unify useMaxWidth and improve CSS scroll responsibility)
  • Unify theme settings retrieval between editor and frontend
  • Convert remaining Japanese entries to English in changelog.txt

2.0.3

  • Disable image insert button in preview mode
  • Fix image preview not updating immediately after insertion
  • Add error handling to image insertion rendering
  • Fix E2E test syntax errors (40 locations total)
  • Update deprecated docker:e2e:* script references
  • Fix E2E test failures with ESM conversion and dynamic port detection
  • Reorganize project root files for better readability
  • Implement recommended improvements from code review

2.0.2

  • Improve PHPDoc for main renderer class

2.0.1

  • Prevent Pro source code leak in WordPress.org packages

1.16.0

  • Fix Pro version plugin license management UI and initialization flow
  • Add Pro version plugin implementation with assets and features
  • Use script handle instead of file path in block.json
  • Use script handle instead of file path in block.json
  • Fix translation JSON hash and domain mismatch
  • Fix translation JSON source field mismatch
  • Add dynamic language path resolution for Pro version
  • Replace Japanese comments with English in block registry
  • Add comprehensive i18n workflow documentation
  • Add comprehensive i18n workflow documentation
  • Add source field troubleshooting to i18n documentation
  • Add i18n translation skill and Pro version language file
  • Add E2E tests for Gutenberg block translations
  • Eliminate Pro/Free version core code duplication
  • Activate Frontmatter Settings translations in Japanese
  • Add JED format JSON for Frontmatter Settings translations
  • Add automated translation hash fix script
  • Update Pro roadmap status for v2.0.0 release

1.16.0

  • [Pro] Standalone mode: Pro version now works independently without requiring Free version
  • [Pro] Automatic conflict detection and Free version deactivation
  • [Pro] License recheck function with rate limiting and backoff strategy
  • [Pro] Server-side feature guard system for Pro features
  • [Pro] Enhanced license management with improved error handling
  • [Pro] Architecture: Embedded Free version core for standalone operation
  • [Pro] License validation: Improved caching and grace period handling
  • [Pro] Created includes/core/ with 15 Free version core files
  • [Pro] Copied assets/ and blocks/ directories to Pro version
  • [Pro] Added SYNC_LOG.md for tracking FreePro synchronization
  • [Pro] Implemented GFMR_Pro_Conflict_Detector class
  • [Pro] Updated bootstrap with init_standalone() method

1.15.0

  • Add Pro version packaging script
  • Separate Pro plugin and enhance extension system
  • Add automatic cleanup of release ZIP files

1.14.1

  • Clean up and optimize npm scripts
  • Add npm test alias for test:quick
  • Preserve cursor position during image insertion
  • Update changelog for cursor position fix
  • Add comprehensive test suite for hasMathContent detection