Syntax Highlight Nano

开发者	ejointjp
更新时间	2025年12月13日 12:35
PHP版本:	7.4 及以上
WordPress版本:	6.9
版权:	GPLv2 or later
版权网址:	版权信息

下载

1.0.4

详情介绍:

Syntax Highlight Nano adds beautiful, customizable syntax highlighting to WordPress's core code block. It integrates seamlessly with the Gutenberg editor, providing a consistent look and feel between the editor and the frontend. Because it extends the existing "Code" block, there is no need for a separate custom block or switching between different block types. Features

Automatic language detection: Intelligently detects the programming language of your code.
Customizable header: Optionally display a header above the code block with a filename or language name.
Line numbers: Toggle line numbers on or off to improve code readability.
Copy to clipboard button: A convenient button appears on hover, allowing users to copy the code with a single click.
Lightweight and performant: Uses highlight.js for efficient, optimized syntax highlighting.
WordPress best practices: Built following WordPress development standards.

How to Use

Install and activate the plugin.
In the WordPress editor, add a standard "Code" block.
Enter your code.
In the block settings sidebar, you can:
Select a programming language (or leave it for automatic detection).
Add a filename.
Toggle header visibility.
Toggle line number visibility.
The code block will be automatically highlighted on the frontend.

安装:

Log in to your WordPress admin dashboard.
Go to Plugins > Add New.
Search for "Syntax Highlight Nano".
Click Install Now, then click Activate.

屏幕截图:

升级注意事项:

1.0.3 Improved language detection and copy button experience. 1.0.2 Added copy-to-clipboard functionality and filename support. 1.0.1 Major performance improvements and better language detection. 1.0.0 Initial release with core syntax highlighting features.

常见问题:

What programming languages are supported?

Syntax Highlight Nano supports a wide range of languages including JavaScript, TypeScript, PHP, Python, Ruby, Java, C#, C++, C, Go, Rust, Swift, Kotlin, HTML, CSS, SCSS, Less, JSON, XML, YAML, Markdown, SQL, Bash, Shell, and PowerShell.

Will this affect my existing code blocks?

Yes. This plugin enhances all standard WordPress core/code blocks. Existing code blocks are automatically highlighted based on your settings.

Is it compatible with my theme?

The plugin uses its own scoped CSS to minimize conflicts with themes. It is designed to be as non‑intrusive as possible. If you encounter any styling issues, please report them.

Does it impact website performance?

The plugin is optimized for performance. Highlight.js is only loaded on pages that contain code blocks, and editor assets are only loaded in the WordPress admin.

Can I customize the styling?

Yes. You can override the default styles by adding custom CSS to your theme's style.css or via the WordPress Customizer. The plugin uses CSS variables to make theme adjustments easier.

更新日志:

1.0.4

Bug Fix.

1.0.3

Added copy and checkmark icons to the copy button for better visual feedback.
Improved language detection accuracy with proper language name mapping.

1.0.2

Implemented a "Copy to clipboard" button that appears when hovering over code blocks.
Added has-filename CSS class to support filename-based headers.

1.0.1

Optimized the frontend HTML structure to use the <pre> tag directly for styling.
Improved CSS for better integration and responsive behavior.
Switched to client-side language auto-detection using highlight.js.

1.0.0

Initial release of Syntax Highlight Nano.
Added syntax highlighting, custom headers, and line numbers to WordPress code blocks.