Enhances the WordPress Code block with syntax highlighting, line numbers, and copy functionality.
Note
This plugin is designed to be used with block themes that use the theme-1, theme-2, etc., naming convention for colors in theme.json. Examples include Base, Kanso, and the Assembler.
- Syntax highlighting powered by highlight.js
- Optional copy to clipboard button
- Optional title/header for code blocks
- Optional line numbers
- Unnecessary styling options and block supports are removed
- WordPress 6.7+
- PHP 7.4+
- Download the plugin.
- Upload the
better-code-blocksfolder to your/wp-content/plugins/directory. - Activate the plugin through the 'Plugins' menu in WordPress.
- Create or edit a post/page in the WordPress block editor.
- Add a Code block.
- Select your programming language.
- Configure additional options in the sidebar:
- Toggle line numbers
- Add a title
- Enable/disable copy button
- Clone this repository.
- Run
npm install. - Run
npm startfor development. - Run
npm run buildfor production.
- Built almost entirely with Cursor.
- Syntax highlighting by highlight.js.