MatthiasHunt / wordpress-syntax-highlighter

A VS Code Extension that adds syntax highlighting to WordPress and Gutenberg decorators and function calls that exist inside traditional comment blocks

This extension provides syntax highlighting for the following WordPress syntaxes that exist inside traditional comment blocks:

• Plugin header fields (PHP)
• Block patten fields (PHP)
• Theme header fields (style.css)
• Block markup (HTML + JSON)

Examples

HTML

CSS

PHP

Additional Features

The Syntax Highlighter also implements rules for pattern/header field validation based on the following official documentation:

• https://developer.wordpress.org/block-editor/reference-guides/block-api/block-patterns/
• https://developer.wordpress.org/themes/advanced-topics/block-patterns/
• https://developer.wordpress.org/plugins/plugin-basics/header-requirements/
• https://developer.wordpress.org/themes/basics/main-stylesheet-style-css/

Unmatched brackets cause error highlighting inside the embedded JSON of WordPress blocks

Credits

This project was inspired by Gutenberg Comment Highlight by @chrisrhymes

Wapuu design by @marktimemedia