{"id":294542,"date":"2026-05-03T12:35:02","date_gmt":"2026-05-03T12:35:02","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/webberzone-code-block-highlighting\/"},"modified":"2026-05-03T12:32:20","modified_gmt":"2026-05-03T12:32:20","slug":"webberzone-code-block-highlighting","status":"publish","type":"plugin","link":"https:\/\/jv.wordpress.org\/plugins\/webberzone-code-block-highlighting\/","author":2277,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_crdt_document":"","version":"1.0.0","stable_tag":"1.0.0","tested":"7.0","requires":"6.6","requires_php":"7.4","requires_plugins":null,"header_name":"WebberZone Code Block Highlighting","header_author":"WebberZone","header_description":"Extends the Gutenberg Code block with syntax highlighting powered by Prism.js.","assets_banners_color":"1b1f55","last_updated":"2026-05-03 12:32:20","external_support_url":"","external_repository_url":"","donate_link":"https:\/\/wzn.io\/donate-wz","header_plugin_uri":"https:\/\/webberzone.com\/webberzone-code-block-highlighting-page\/","header_author_uri":"https:\/\/webberzone.com","rating":0,"author_block_rating":0,"active_installs":0,"downloads":59,"num_ratings":0,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"1.0.0":{"tag":"1.0.0","author":"Ajay","date":"2026-05-03 12:32:20"}},"upgrade_notice":{"1.0.0":"<p>Initial release.<\/p>"},"ratings":[],"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":3521484,"resolution":"128x128","location":"assets","locale":""},"icon-256x256.png":{"filename":"icon-256x256.png","revision":3521484,"resolution":"256x256","location":"assets","locale":""}},"assets_banners":{"banner-1544x500.png":{"filename":"banner-1544x500.png","revision":3521484,"resolution":"1544x500","location":"assets","locale":""},"banner-772x250.png":{"filename":"banner-772x250.png","revision":3521484,"resolution":"772x250","location":"assets","locale":""}},"assets_blueprints":{},"all_blocks":[],"tagged_versions":["1.0.0"],"block_files":[],"assets_screenshots":{"screenshot-1.png":{"filename":"screenshot-1.png","revision":3521484,"resolution":"1","location":"assets","locale":""},"screenshot-2.png":{"filename":"screenshot-2.png","revision":3521484,"resolution":"2","location":"assets","locale":""},"screenshot-3.png":{"filename":"screenshot-3.png","revision":3521484,"resolution":"3","location":"assets","locale":""}},"screenshots":{"1":"Block editor \u2014 language picker, line numbers toggle, title field, and more in the Inspector Controls sidebar.","2":"Frontend code block with Prism.js syntax highlighting, line numbers, and toolbar.","3":"Plugin settings page \u2014 choose a global colour scheme, default language, and more."},"jetpack_post_was_ever_published":false},"plugin_section":[],"plugin_tags":[1214,24363,148076,7527,4609],"plugin_category":[],"plugin_contributors":[78250,78249],"plugin_business_model":[],"class_list":["post-294542","plugin","type-plugin","status-publish","hentry","plugin_tags-code","plugin_tags-code-block","plugin_tags-gutenberg","plugin_tags-prism","plugin_tags-syntax-highlighting","plugin_contributors-ajay","plugin_contributors-webberzone","plugin_committers-ajay"],"banners":{"banner":"https:\/\/ps.w.org\/webberzone-code-block-highlighting\/assets\/banner-772x250.png?rev=3521484","banner_2x":"https:\/\/ps.w.org\/webberzone-code-block-highlighting\/assets\/banner-1544x500.png?rev=3521484","banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":false,"icon":"https:\/\/ps.w.org\/webberzone-code-block-highlighting\/assets\/icon-128x128.png?rev=3521484","icon_2x":"https:\/\/ps.w.org\/webberzone-code-block-highlighting\/assets\/icon-256x256.png?rev=3521484","generated":false},"screenshots":[{"src":"https:\/\/ps.w.org\/webberzone-code-block-highlighting\/assets\/screenshot-1.png?rev=3521484","caption":"Block editor \u2014 language picker, line numbers toggle, title field, and more in the Inspector Controls sidebar."},{"src":"https:\/\/ps.w.org\/webberzone-code-block-highlighting\/assets\/screenshot-2.png?rev=3521484","caption":"Frontend code block with Prism.js syntax highlighting, line numbers, and toolbar."},{"src":"https:\/\/ps.w.org\/webberzone-code-block-highlighting\/assets\/screenshot-3.png?rev=3521484","caption":"Plugin settings page \u2014 choose a global colour scheme, default language, and more."}],"raw_content":"<!--section=description-->\n<p><strong>WebberZone Code Block Highlighting<\/strong> is the easiest way to add syntax highlighting to your WordPress site. It extends the native Gutenberg <code>core\/code<\/code> block with <a href=\"https:\/\/prismjs.com\/\">Prism.js<\/a> highlighting \u2014 no shortcodes, no block replacement, no risk of breaking existing posts.<\/p>\n\n<p>Simply activate the plugin and your code blocks will instantly display beautiful, readable syntax highlighting on the frontend. Choose from 35+ programming languages and 21 colour themes, all controlled from the block editor's Inspector Controls sidebar.<\/p>\n\n<h3>Why use this plugin?<\/h3>\n\n<ul>\n<li><strong>Safe by design<\/strong> \u2014 Works as a filter on top of <code>core\/code<\/code>. Existing posts are never invalidated. Deactivate the plugin and your blocks are still valid standard WordPress code blocks.<\/li>\n<li><strong>Zero configuration<\/strong> \u2014 Activate and start writing. No setup wizard, no shortcodes.<\/li>\n<li><strong>Smart asset loading<\/strong> \u2014 Prism CSS and JS only load on pages that actually contain code blocks. Pages without code stay fast.<\/li>\n<li><strong>Per-block controls<\/strong> \u2014 Set language, theme, line numbers, word wrap, title, highlighted lines, and max height individually for each block.<\/li>\n<li><strong>Developer-friendly<\/strong> \u2014 Filters to add languages, override themes, and force asset loading.<\/li>\n<\/ul>\n\n<h3>Supported languages<\/h3>\n\n<p>40 languages including: Apache Config, Bash, C, C++, C#, CSS, Dart, Docker, F#, Go, GraphQL, Groovy, Haskell, HTML, Java, JavaScript, JSON, JSX, Kotlin, Lua, Markdown, Nginx, Objective-C, Perl, PHP, PowerShell, Python, R, Ruby, Rust, Sass, Scala, SQL, Swift, TOML, TSX, TypeScript, Vim, XML, YAML. Use the <code>wzcbh_languages<\/code> filter to add or remove entries from the language picker.<\/p>\n\n<h3>Included themes (21)<\/h3>\n\n<p>A11y Dark, Coldark Cold (Light), Coldark Dark, Dracula, Duotone Dark, Duotone Light, GitHub (Light), Gruvbox Dark, Gruvbox Light, Lucario, Material Dark, Material Light, Night Owl, Nord, One Dark, One Light, Shades of Purple, Solarized Dark, Synthwave '84, VS Code Dark+, Xonokai (Monokai).<\/p>\n\n<h3>Per-block features<\/h3>\n\n<ul>\n<li><strong>Language selector<\/strong> \u2014 Choose the programming language from the sidebar; applies the correct Prism grammar automatically.<\/li>\n<li><strong>Line numbers<\/strong> \u2014 Toggle line numbers per block, with a configurable start line.<\/li>\n<li><strong>File title \/ label<\/strong> \u2014 Add an optional filename or label displayed in the code block toolbar.<\/li>\n<li><strong>Highlight lines<\/strong> \u2014 Specify lines or ranges (e.g. <code>1,3-5<\/code>) to visually highlight using Prism's line-highlight plugin.<\/li>\n<li><strong>Max height with expand\/collapse<\/strong> \u2014 Set a maximum height in pixels; an expand\/collapse toolbar button appears automatically.<\/li>\n<li><strong>Word wrap<\/strong> \u2014 Toggle soft word wrapping per block.<\/li>\n<\/ul>\n\n<h3>Global settings<\/h3>\n\n<ul>\n<li>Default colour scheme (theme)<\/li>\n<li>Default language<\/li>\n<li>Default line numbers toggle and start value<\/li>\n<li>Default word wrap<\/li>\n<li>Copy-to-clipboard button<\/li>\n<li>Show language label in toolbar<\/li>\n<li>Font size<\/li>\n<\/ul>\n\n<h3>Developer filters<\/h3>\n\n<ul>\n<li><code>wzcbh_languages<\/code> \u2014 Filter the language list array (<code>slug =&gt; label<\/code>)<\/li>\n<li><code>wzcbh_color_scheme_css_url<\/code> \u2014 Override the Prism theme CSS URL<\/li>\n<li><code>wzcbh_force_load_assets<\/code> \u2014 Force Prism assets to load on every page<\/li>\n<\/ul>\n\n<h3>GDPR<\/h3>\n\n<p>WebberZone Code Block Highlighting does not collect personal data, set cookies, or communicate with any external services.<\/p>\n\n<h3>Contribute<\/h3>\n\n<p>The plugin is open source and available on <a href=\"https:\/\/github.com\/WebberZone\/webberzone-code-block-highlighting\">GitHub<\/a>. Pull requests for bug fixes and new features are welcome. Please use the <a href=\"https:\/\/wordpress.org\/support\/plugin\/webberzone-code-block-highlighting\/\">WordPress.org support forum<\/a> for support and <a href=\"https:\/\/github.com\/WebberZone\/webberzone-code-block-highlighting\/issues\">GitHub Issues<\/a> for confirmed bug reports.<\/p>\n\n<h3>Translations<\/h3>\n\n<p>Help translate WebberZone Code Block Highlighting into your language on <a href=\"https:\/\/translate.wordpress.org\/projects\/wp-plugins\/webberzone-code-block-highlighting\">WordPress.org<\/a>. See the <a href=\"https:\/\/make.wordpress.org\/polyglots\/handbook\/rosetta\/theme-plugin-directories\/\">Translator Handbook<\/a> for guidance.<\/p>\n\n<h3>Other plugins by WebberZone<\/h3>\n\n<ul>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/contextual-related-posts\/\">Contextual Related Posts<\/a> \u2014 Display fast, intelligent related posts to keep visitors on your site longer<\/li>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/top-10\/\">Top 10<\/a> \u2014 Track daily and total visits and display popular and trending posts<\/li>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/add-to-all\/\">WebberZone Snippetz<\/a> \u2014 Manage custom HTML, CSS and JS snippets across your site<\/li>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/knowledgebase\/\">Knowledge Base<\/a> \u2014 Create a knowledge base or FAQ section on your WordPress site<\/li>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/better-search\/\">Better Search<\/a> \u2014 Contextual search results sorted by relevance<\/li>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/autoclose\/\">Auto-Close<\/a> \u2014 Automatically close comments, pingbacks, trackbacks and manage revisions<\/li>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/popular-authors\/\">Popular Authors<\/a> \u2014 Display popular authors in a WordPress widget<\/li>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/where-did-they-go-from-here\/\">Followed Posts<\/a> \u2014 Show related posts based on what your visitors have already read<\/li>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/webberzone-link-warnings\/\">WebberZone Link Warnings<\/a> \u2014 Add accessible warnings for external links and target=\"_blank\" links<\/li>\n<\/ul>\n\n<!--section=installation-->\n<h4>WordPress admin (recommended)<\/h4>\n\n<ol>\n<li>Go to <strong>Plugins &gt; Add New<\/strong> in your WordPress admin.<\/li>\n<li>Search for <strong>WebberZone Code Block Highlighting<\/strong>.<\/li>\n<li>Click <strong>Install Now<\/strong>, then <strong>Activate<\/strong>.<\/li>\n<\/ol>\n\n<h4>Manual installation<\/h4>\n\n<ol>\n<li>Download the plugin zip file.<\/li>\n<li>Extract it to your <code>wp-content\/plugins\/<\/code> directory. You should end up with a <code>webberzone-code-block-highlighting\/<\/code> folder.<\/li>\n<li>Go to <strong>Plugins<\/strong> in your WordPress admin and activate <strong>WebberZone Code Block Highlighting<\/strong>.<\/li>\n<\/ol>\n\n<p>After activation, open any post or page in the block editor, add or select a Code block, and the <strong>Code Highlighting<\/strong> panel will appear in the Inspector Controls sidebar.<\/p>\n\n<!--section=faq-->\n<dl>\n<dt id=\"does%20this%20plugin%20replace%20the%20core%20code%20block%3F\"><h3>Does this plugin replace the core Code block?<\/h3><\/dt>\n<dd><p>No. WebberZone Code Block Highlighting uses JavaScript and PHP filters to extend the native <code>core\/code<\/code> block. It never swaps the block for a custom one, so existing posts are never invalidated and the plugin can be deactivated without leaving behind broken blocks.<\/p><\/dd>\n<dt id=\"will%20my%20code%20blocks%20break%20if%20i%20deactivate%20the%20plugin%3F\"><h3>Will my code blocks break if I deactivate the plugin?<\/h3><\/dt>\n<dd><p>No. Because the plugin extends <code>core\/code<\/code> rather than replacing it, deactivating simply removes the highlighting. Your code content is stored in standard WordPress block markup and remains valid.<\/p><\/dd>\n<dt id=\"which%20programming%20languages%20are%20supported%3F\"><h3>Which programming languages are supported?<\/h3><\/dt>\n<dd><p>40 languages out of the box: Apache Config, Bash, C, C++, C#, CSS, Dart, Docker, F#, Go, GraphQL, Groovy, Haskell, HTML, Java, JavaScript, JSON, JSX, Kotlin, Lua, Markdown, Nginx, Objective-C, Perl, PHP, PowerShell, Python, R, Ruby, Rust, Sass, Scala, SQL, Swift, TOML, TSX, TypeScript, Vim, XML, and YAML.<\/p>\n\n<p>Use the <code>wzcbh_languages<\/code> filter to add or remove entries from the language picker. Note: adding a language to the filter only affects the UI dropdown \u2014 the corresponding Prism.js grammar must also be available on the frontend (either bundled in <code>frontend.js<\/code> or loaded separately).<\/p><\/dd>\n<dt id=\"how%20do%20i%20add%20a%20custom%20or%20additional%20prism%20theme%3F\"><h3>How do I add a custom or additional Prism theme?<\/h3><\/dt>\n<dd><ol>\n<li>Add the theme mapping in <code>build-prism.js<\/code>.<\/li>\n<li>Copy the generated CSS to <code>includes\/assets\/<\/code>.<\/li>\n<li>Register the slug in <code>includes\/admin\/class-settings.php<\/code>.<\/li>\n<li>Run <code>npm run build:prism<\/code>.<\/li>\n<\/ol>\n\n<p>You can also use the <code>wzcbh_color_scheme_css_url<\/code> filter to point to any CSS file without touching the plugin source.<\/p><\/dd>\n<dt id=\"does%20prism.js%20load%20on%20every%20page%3F\"><h3>Does Prism.js load on every page?<\/h3><\/dt>\n<dd><p>No. Prism CSS and JS are only enqueued on pages that contain at least one code block. All other pages are unaffected. Use the <code>wzcbh_force_load_assets<\/code> filter to override this behaviour if needed.<\/p><\/dd>\n<dt id=\"how%20do%20i%20highlight%20specific%20lines%20in%20a%20code%20block%3F\"><h3>How do I highlight specific lines in a code block?<\/h3><\/dt>\n<dd><p>Enter a comma-separated list of lines or ranges in the <strong>Highlight Lines<\/strong> field in the Inspector Controls sidebar (e.g. <code>1,3-5,8<\/code>). This maps to the <code>data-line<\/code> attribute consumed by the Prism line-highlight plugin.<\/p><\/dd>\n<dt id=\"can%20i%20show%20a%20filename%20or%20label%20on%20the%20code%20block%3F\"><h3>Can I show a filename or label on the code block?<\/h3><\/dt>\n<dd><p>Yes. Use the <strong>Title<\/strong> field in the Inspector Controls sidebar. The label is displayed in the Prism toolbar above the code block.<\/p><\/dd>\n<dt id=\"does%20the%20plugin%20support%20dark%20mode%20or%20multiple%20themes%3F\"><h3>Does the plugin support dark mode or multiple themes?<\/h3><\/dt>\n<dd><p>The plugin ships with 21 Prism themes. The active theme is selected globally on the settings page (<strong>Settings &gt; Code Block Highlighting<\/strong>). Per-block theme switching is not currently supported.<\/p><\/dd>\n<dt id=\"is%20this%20plugin%20compatible%20with%20the%20wordpress%20block%20editor%20%28gutenberg%29%3F\"><h3>Is this plugin compatible with the WordPress block editor (Gutenberg)?<\/h3><\/dt>\n<dd><p>Yes. The plugin is built specifically for the Gutenberg block editor (WordPress 6.6+) and uses the native block filter APIs. It does not support the Classic Editor.<\/p><\/dd>\n<dt id=\"how%20can%20i%20report%20security%20vulnerabilities%3F\"><h3>How can I report security vulnerabilities?<\/h3><\/dt>\n<dd><p>Report security bugs through the Patchstack Vulnerability Disclosure Program. The Patchstack team will validate, triage, and handle any reported vulnerabilities. <a href=\"https:\/\/patchstack.com\/database\/vdp\/webberzone-code-block-highlighting\">Report a security vulnerability.<\/a><\/p><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>1.0.0<\/h4>\n\n<ul>\n<li>Initial release.<\/li>\n<li>Extends <code>core\/code<\/code> with Prism.js syntax highlighting \u2014 no block replacement, no block validation errors.<\/li>\n<li>40 supported languages with per-block language selection.<\/li>\n<li>21 built-in Prism themes selectable from the settings page.<\/li>\n<li>Per-block controls: language, line numbers, start line, word wrap, title, highlight lines, and max height.<\/li>\n<li>Expand\/collapse toolbar button for blocks with a max-height set.<\/li>\n<li>Smart asset loading \u2014 Prism CSS and JS only enqueued on pages containing code blocks.<\/li>\n<li>Copy-to-clipboard and show-language toolbar buttons (configurable globally).<\/li>\n<li>Global settings page for colour scheme, default language, and more.<\/li>\n<li>Developer filters: <code>wzcbh_languages<\/code>, <code>wzcbh_color_scheme_css_url<\/code>, <code>wzcbh_force_load_assets<\/code>.<\/li>\n<li>GDPR-friendly: no data collection, no external requests.<\/li>\n<\/ul>","raw_excerpt":"Add beautiful syntax highlighting to the Gutenberg Code block \u2014 powered by Prism.js with 21 themes and 40 languages, zero configuration required.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/jv.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/294542","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jv.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/jv.wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/jv.wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=294542"}],"author":[{"embeddable":true,"href":"https:\/\/jv.wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/ajay"}],"wp:attachment":[{"href":"https:\/\/jv.wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=294542"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/jv.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=294542"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/jv.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=294542"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/jv.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=294542"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/jv.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=294542"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/jv.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=294542"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}