Title: Syntax Highlight Nano
Author: Takashi Fujisaki
Published: <strong>Kevardhu 13, 2025</strong>
Last modified: Hwevrer 27, 2026

---

Search plugins

![](https://s.w.org/plugins/geopattern-icon/syntax-highlight-nano.svg)

# Syntax Highlight Nano

 By [Takashi Fujisaki](https://profiles.wordpress.org/ejointjp/)

[Download](https://downloads.wordpress.org/plugin/syntax-highlight-nano.1.1.2.zip)

 * [Details](https://cor.wordpress.org/plugins/syntax-highlight-nano/#description)
 * [Reviews](https://cor.wordpress.org/plugins/syntax-highlight-nano/#reviews)
 *  [Installation](https://cor.wordpress.org/plugins/syntax-highlight-nano/#installation)
 * [Development](https://cor.wordpress.org/plugins/syntax-highlight-nano/#developers)

 [Support](https://wordpress.org/support/plugin/syntax-highlight-nano/)

## Description

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. This plugin is built on top of **highlight.js**, 
ensuring accurate and performant syntax highlighting for a wide variety of languages.

#### 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

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

### Privacy

This plugin does not collect any personal data. It does not set cookies or connect
to external services. All processing happens locally on your server and in the user’s
browser.

### Credits

This plugin uses highlight.js (BSD 3‑Clause License).
 Copyright (c) 2006, Ivan 
Sagalaev https://github.com/highlightjs/highlight.js

### Support

For support, feature requests, and bug reports, please visit:
 https://github.com/
takashifujisaki/syntax-highlight-nano/issues

## Screenshots

 * [[
 * Code block in the WordPress editor with syntax highlight settings.
 * [[
 * Frontend display with syntax highlighting, header, and line numbers.
 * [[
 * Copy‑to‑clipboard button appearing on hover.
 * [[
 * Block settings panel with language selection and customization options.

## Installation

 1. Log in to your WordPress admin dashboard.
 2. Go to **Plugins > Add New**.
 3. Search for “Syntax Highlight Nano”.
 4. Click **Install Now**, then click **Activate**.

## FAQ

### 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, PowerShell, and AppleScript.

### 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.

## Reviews

There are no reviews for this plugin.

## Contributors & Developers

“Syntax Highlight Nano” is open source software. The following people have contributed
to this plugin.

Contributors

 *   [ Takashi Fujisaki ](https://profiles.wordpress.org/ejointjp/)

[Translate “Syntax Highlight Nano” into your language.](https://translate.wordpress.org/projects/wp-plugins/syntax-highlight-nano)

### Interested in development?

[Browse the code](https://plugins.trac.wordpress.org/browser/syntax-highlight-nano/),
check out the [SVN repository](https://plugins.svn.wordpress.org/syntax-highlight-nano/),
or subscribe to the [development log](https://plugins.trac.wordpress.org/log/syntax-highlight-nano/)
by [RSS](https://plugins.trac.wordpress.org/log/syntax-highlight-nano/?limit=100&mode=stop_on_copy&format=rss).

## Changelog

#### 1.1.2

 * Bug fix: Resolved 500 fatal error on code block save caused by undefined settings
   array keys in PHP 8.1+.

#### 1.1.1

 * Bug Fix.

#### 1.1.0

 * Added support for AppleScript.
 * Update CSS.

#### 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.

## Meta

 *  Version **1.1.2**
 *  Last updated **1 mis ago**
 *  Active installations **Fewer than 10**
 *  WordPress version ** 6.0 or higher **
 *  Tested up to **6.9.4**
 *  PHP version ** 7.4 or higher **
 *  Language
 * [English (US)](https://wordpress.org/plugins/syntax-highlight-nano/)
 * Tags
 * [code](https://cor.wordpress.org/plugins/tags/code/)[code block](https://cor.wordpress.org/plugins/tags/code-block/)
   [gutenberg](https://cor.wordpress.org/plugins/tags/gutenberg/)[highlight.js](https://cor.wordpress.org/plugins/tags/highlight-js/)
   [syntax highlighting](https://cor.wordpress.org/plugins/tags/syntax-highlighting/)
 *  [Advanced View](https://cor.wordpress.org/plugins/syntax-highlight-nano/advanced/)

## Ratings

No reviews have been submitted yet.

[Your review](https://wordpress.org/support/plugin/syntax-highlight-nano/reviews/#new-post)

[See all reviews](https://wordpress.org/support/plugin/syntax-highlight-nano/reviews/)

## Contributors

 *   [ Takashi Fujisaki ](https://profiles.wordpress.org/ejointjp/)

## Support

Got something to say? Need help?

 [View support forum](https://wordpress.org/support/plugin/syntax-highlight-nano/)