Highlighting WordPress’s Code block

One setting gives every standard WordPress Code block syntax colors, or turns it into a full Nahnu Code Block, without editing a single post.

Turning it on#

Go to Settings → Nahnu Code Block, find Standard Code block, pick an option and click Save Settings. It’s Off by default, so installing or updating the plugin never changes your existing Code blocks on its own.

1. In your WordPress admin, open Settings → Nahnu Code Block.
2. Under Standard Code block, choose Colors only or Replace.
3. Optionally pick a Default language (HTML / XML is selected out of the box).
4. Click Save Settings, then reload any page with a Code block.

The setting applies site-wide, to every core Code block on every post, page and doc. Requires Nahnu Code & API Block 1.0.3 or later.

The three options#

Colors only suits most sites: your theme keeps styling the block and it just gains syntax colors. Replace gives every Code block the full Nahnu experience.

	Off	Colors only	Replace
Syntax colors	No	Yes	Yes
Light / dark mode colors	No	Yes	Yes
Theme’s own padding, font and frame	Kept	Kept	Replaced by Nahnu Code Block styling
Copy button	No	No	Yes
Collapse with “View all code”	No	No	Yes
Line numbers	No	No	Yes
Visitor light/dark toggle	No	No	Yes

Both Colors only and Replace change only what visitors see. Your saved posts are never edited, so switching back to Off restores every Code block exactly as it was. Your color choices on the same settings page apply to both.

Choosing a language#

Colors depend on knowing the code’s language. Each Code block uses the first of these that’s set:

1. The block’s own choice. Select a Code block in the editor and open the Syntax highlighting panel in its sidebar, then pick a language. Choose None to leave that one block uncolored.
2. A CSS class. Typing language-php (or lang-php) into the block’s Additional CSS class(es) field under Advanced works the same way.
3. The site default. Anything without its own choice uses the Default language from the settings page. Set it to None to only color blocks that pick a language.

Available languages: HTML / XML, CSS, SCSS, JavaScript, TypeScript, JSX, JSON, PHP, Python, Bash / Shell, SQL, YAML, Ruby, Java, C, C++, C#, Go, Rust, Swift, Markdown and WordPress Shortcode.

For PHP mixed with HTML, such as a template or form, choose PHP: it colors the HTML tags as well as the PHP inside them.

Converting blocks permanently#

To turn one Code block into a real Nahnu Code Block in the post itself, use the block toolbar’s Transform menu. Unlike the setting, this edits that post.

1. Select the Code block in the editor.
2. Click the block icon at the left of the toolbar.
3. Choose Nahnu Code Block. The code and its chosen language carry over.

It works in reverse too: transform a Nahnu Code Block back into a standard Code block. Once converted, the block has every Nahnu Code Block option in its sidebar (title, line numbers, collapse height and more), whatever the site setting says.

Troubleshooting#

If a Code block shows no colors, view the page source (Ctrl+U or Cmd+Option+U) and search for nahnu-code-block-core. If it’s missing, the setting isn’t reaching that block yet:

• Setting still Off. Check Settings → Nahnu Code Block → Standard Code block is on Colors only or Replace, and that you clicked Save Settings.
• No language. The block has no language picked and the Default language is None. Pick one in the block’s sidebar or set a default.
• Old plugin version. The setting needs version 1.0.3 or later (check Plugins).
• Page cache. Purge your caching plugin or host cache so visitors get the new HTML.

Other things to know:

• Colors appear on the live site, not in the editor. The block editor still shows the plain Code block.
• Inline formatting is dropped. Bold text or links typed inside a Code block are removed once it’s highlighted.
• Another highlighter on the page. If a theme or plugin also highlights code (for example WP Super Docs), use Replace so the block is handled by Nahnu Code Block alone, or turn the other highlighter off.