Title: Highlighting Code Block Author: LOOS Published: 12 Dujember 2018 Last modified: 22 Maggu 2026 --- Search plugins ![](https://ps.w.org/highlighting-code-block/assets/banner-772x250.png?rev=2432522) ![](https://ps.w.org/highlighting-code-block/assets/icon-256x256.png?rev=2432522) # Highlighting Code Block By [LOOS](https://profiles.wordpress.org/looswebstudio/) [Download](https://downloads.wordpress.org/plugin/highlighting-code-block.2.2.0.zip) * [Details](https://kab.wordpress.org/plugins/highlighting-code-block/#description) * [Reviews](https://kab.wordpress.org/plugins/highlighting-code-block/#reviews) * [Installation](https://kab.wordpress.org/plugins/highlighting-code-block/#installation) * [Development](https://kab.wordpress.org/plugins/highlighting-code-block/#developers) [Support](https://wordpress.org/support/plugin/highlighting-code-block/) ## Description « Highlighting Code Block » allows you to add a syntax-highlighted code block with just a click. It supports both « Block Editor » and « Classic Editor ». (However, we recommend using it in the « Block Editor ».) Please see the following page for a detailed explanation of this plugin. URL: [https://loos.co.jp/en/documents/highlighting-code-block/](https://loos.co.jp/en/documents/highlighting-code-block/) ### Source code The source code of this plugin is available on Github. URL: [https://github.com/ddryo/Highlighting-Code-Block](https://github.com/ddryo/Highlighting-Code-Block) ### How to use #### How to use （For Block Editor） * Open the « Formatting » category of the Block Inserter. * There is a custom block named « Highlighing Code Block ». * Select it, the block will be inserted. * Select the language of the code and enter any code. #### How to use （For Classic Editor） * You should see a select box labeled « Code Block » on the toolbar (2nd row by default). * When you select a language from the select box, a code block (pre tag) is inserted. #### If it doesn’t work This plugin works only with PHP version 5.6 or later, WordPress 5.6 or later. Please check your PHP version or WordPress version. #### About settings The menu « [HCB] Settings » should be added to « Settings » in the left menu of the management screen. Settings related to this plugin are set in this menu. ## Screenshots * [[ * Code Coloring * [[ * Select 「Highlighing Code Block * [[ * Select lang (Guternberg) * [[ * Writing your code (Guternberg) * [[ * Added select box (Tinymce) * [[ * Select lang (Tinymce) * [[ * Writing your code (Tinymce) * [[ * ex) Light color * [[ * ex) Dark color * [[ * Base Setting * [[ * Higher Setting ## Blocks This plugin provides 1 block. * Highlighing Code Block ## Installation This plugin can be installed directly from your site. 1. Log in and navigate to « Plugins » « Add New ». 2. Type « Highlighting Code Block » in the search field and press Enter. 3. Locate the plugin in the list of search results and click « Install Now ». 4. Once installed, click the « Activate » button. ## FAQ ### Available languages The following languages are available by default. * HTML * CSS * SCSS * JavaScript * TypeScript * PHP * Ruby * Python * Swift * C * C# * C++ * Objective-C * SQL * JSON * Bash * Git ## Reviews ![](https://secure.gravatar.com/avatar/bbdf310142e4523583701a048b98b0ca190e9faa6d39f4cf21c0dff73c31e87e? s=60&d=retro&r=g) ### 󠀁[站点爆炸](https://wordpress.org/support/topic/%e7%ab%99%e7%82%b9%e7%88%86%e7%82%b8/)󠁿 [liuliu66](https://profiles.wordpress.org/liuliu66/) 14 Ibrir 2024 在寻求关于此问题的帮助时，您可能需要提供以下信息：WordPress 版本 6.5.2目前启用的 主题：Vikinger – BuddyPress Social Community（1.9.9.4.2 版本）当前插件：Highlighting Code Block（版本 2.0.1）PHP 版本 8.1.27 错误详情============错误类型 E_ERROR 发生 在文件 /www/wwwroot/1.14.58.204/wp-content/plugins/highlighting-code-block/class/ loos_hcb_menu.php 的 140 行。错误信息：Uncaught ValueError: Unknown format specifier« � » in /www/wwwroot/1.14.58.204/wp-content/plugins/highlighting-code-block/class/ loos_hcb_menu.php:140Stack trace:#0 /www/wwwroot/1.14.58.204/wp-content/plugins/ highlighting-code-block/class/loos_hcb_menu.php(140): sprintf()#1 /www/wwwroot/1.14.58.204/ wp-includes/class-wp-hook.php(324): {closure}()#2 /www/wwwroot/1.14.58.204/wp-includes/ class-wp-hook.php(348): WP_Hook->apply_filters()#3 /www/wwwroot/1.14.58.204/wp-includes/ plugin.php(517): WP_Hook->do_action()#4 /www/wwwroot/1.14.58.204/wp-admin/admin. php(175): do_action()#5 /www/wwwroot/1.14.58.204/wp-admin/plugins.php(10): require_once(‘…’)# 6 {main}thrown ![](https://secure.gravatar.com/avatar/f85989dc34b218af0380bd6e7f25fe2ddae526cdcbe99653801a8c2fbedf724e? s=60&d=retro&r=g) ### 󠀁[very nice](https://wordpress.org/support/topic/veey-nice/)󠁿 [sazone](https://profiles.wordpress.org/sazone/) 19 Meɣres 2024 read code easily ![](https://secure.gravatar.com/avatar/c6f2d8a321247d15872a2516f44f276f425f9a21498cb132807d674b17c71308? s=60&d=retro&r=g) ### 󠀁[Good Job!](https://wordpress.org/support/topic/good-job-1763/)󠁿 [ishere](https://profiles.wordpress.org/ishere/) 17 Dujember 2023 Very thanks! ![](https://secure.gravatar.com/avatar/134d72580c6ecd9f2f4b36bc69a5a9c17dbb3530c022a3523bacf6a55a521cf4? s=60&d=retro&r=g) ### 󠀁[No support for Android syntax](https://wordpress.org/support/topic/no-support-for-android-syntax/)󠁿 [Rouzbeh Zarei](https://profiles.wordpress.org/iamrouzbehzarei/) 4 Unbir 2023 1 reply Unfortunately, the plugin doesn’t support Java, Kotlin, Flutter nor XML syntax, making it completely useless for anyone in the Android development field. ![](https://secure.gravatar.com/avatar/77530765f24709bda5ef811b35543551e5ba4ae435bf00a38da74d3aeacd29b2? s=60&d=retro&r=g) ### 󠀁[A+ Once I figured out the BLOCKS part!](https://wordpress.org/support/topic/a-once-i-figured-out-the-blocks-part/)󠁿 [Anonymous User 20287723](https://profiles.wordpress.org/anonymized-20287723/) 25 Yulyu 2023 I don’t normally use WP Blocks and so I could not figure out why this plugin broke for certain code syntax (PHP -> HTML -> PHP for example) and why saving sometimes broke the previously-saved syntax. Maddening. Then I switched back to the block editor. AHA! It works beautifully. That’s probably why it says « Block » in the plugin name, duh. Thank you very much for this wonderful plugin. I love that we can also upload our own prism.js files. Cool. ![](https://secure.gravatar.com/avatar/82d9afeba3f9fbb7039b6ae795c8871d8d23618399edff6b42cf5ba880039c2d? s=60&d=retro&r=g) ### 󠀁[Thank you!](https://wordpress.org/support/topic/thank-you-3312/)󠁿 [Muhammad Zohaib](https://profiles.wordpress.org/fangsword/) 3 Meɣres 2023 Exactly what I was looking for. thanks alot! [ Read all 22 reviews ](https://wordpress.org/support/plugin/highlighting-code-block/reviews/) ## Contributors & Developers “Highlighting Code Block” is open source software. The following people have contributed to this plugin. Contributors * [ LOOS ](https://profiles.wordpress.org/looswebstudio/) “Highlighting Code Block” has been translated into 5 locales. Thank you to [the translators](https://translate.wordpress.org/projects/wp-plugins/highlighting-code-block/contributors) for their contributions. [Translate “Highlighting Code Block” into your language.](https://translate.wordpress.org/projects/wp-plugins/highlighting-code-block) ### Interested in development? [Browse the code](https://plugins.trac.wordpress.org/browser/highlighting-code-block/), check out the [SVN repository](https://plugins.svn.wordpress.org/highlighting-code-block/), or subscribe to the [development log](https://plugins.trac.wordpress.org/log/highlighting-code-block/) by [RSS](https://plugins.trac.wordpress.org/log/highlighting-code-block/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 2.2.0 * Support for WordPress 7.0. #### 2.1.3 * Fixed an issue where there was a discrepancy in the structure of the build files. #### 2.1.2 * Support for WordPress 6.9. #### 2.1.1 * Support for WordPress 6.8. #### 2.1.0 * Support for WordPress 6.7. #### 2.0.1 * Some text of setting items has been changed. #### 2.0.0 * Support for WordPress 6.4. * Support for PHP 8.2. * The CSS and Block UI have been significantly adjusted. * CSS custom properties have also been renamed and cleaned up overall. * Added `data-start` attribute settings to blocks. #### 1.7.0 * Support for WordPress 6.2. * The style loading process has been fine-tuned. * Added aria-label to the Copy Code button. #### 1.6.1 * Support for WordPress 6.1. #### 1.6.0 * Support for WordPress 6.0. #### 1.5.5 * Fixed the version number. #### 1.5.4 #### 1.5.3 * Fixed a bug. #### 1.5.2 * Fixed the problem of misaligned lines in some themes. #### 1.5.1 * Fixed a bug. #### 1.5.0 * Support for WordPress 5.9. * Refactored the CSS. #### 1.4.1 * Fixed a bug where changing the settings in the languages list did not change the choices in the block. #### 1.4.0 * Fixed a bug that amplified the class of the block. * Fixed a bug that caused clipboard.js to be loaded even when it was not needed. #### 1.3.0 * Support for WordPress 5.8. * Required WordPress version raised to 5.6. #### 1.2.9 * Fixed a bug that the number of lines is not displayed. #### 1.2.8 * Support for WordPress 5.7. * Fixed spelling mistakes. (« plane » to « plain ») * Code fixes. #### 1.2.7 * Added copy button function. * Code refactoring. * Support for WordPress 5.6. #### 1.2.6 Fixed file icon 404 error. #### 1.2.5 * Made the code lighter. * Changed handle name of CSS and JS. #### 1.2.4 Fixed register block. #### 1.2.3 Fixed block.json file. #### 1.2.2 * Adjustments for registering « block libraries ». * Abolished the block width adjustment function. * Abolished the ability to remove « br » tag from the « code » tag. #### 1.2.1 Change the code to register the script. #### 1.2.0 * Fixed a bug that CSS cannot be read depending on the server. * It is now possible to set whether to display the language name for each block. * Even if the language name is set to hidden, it will be displayed if the file name is entered. * You can now preview the display of language names and file names in the block editor. #### 1.1.0 Fixed translation file. #### 1.0.9 Fixed translation file. #### 1.0.8 English is supported. #### 1.0.7 * Compatible with WordPress5.3. * Deleted the left and right margins of the HCB code block, and left it to the theme. * Enabled conversion with core « source code block ». #### 1.0.6 * Compress CSS file to read. * Changed to load some CSS with style tag in head. * Fixed a bug that font family settings were not reflected. * Code cleanup for CSS and JS #### 1.0.5 * Move reading script to wp_footer. * Changed HCB block logo. * You can now set font-family for code blocks. #### 1.0.4 * Support for WordPress 5.2.1 * Changed font-family of code block. * The file name can be set to the code block. #### 1.0.3 Support for WordPress 5.1.1 #### 1.0.2 Change readme.txt #### 1.0.1 Comment delete. #### 1.0 Initial release. ## Meta * Version **2.2.0** * Last updated **3 n wussan ago** * Active installations **10,000+** * WordPress version ** 5.6 or higher ** * Tested up to **7.0** * PHP version ** 5.6 or higher ** * Languages * [Dutch](https://nl.wordpress.org/plugins/highlighting-code-block/), [English (US)](https://wordpress.org/plugins/highlighting-code-block/), [French (France)](https://fr.wordpress.org/plugins/highlighting-code-block/), [Greek](https://el.wordpress.org/plugins/highlighting-code-block/), [Japanese](https://ja.wordpress.org/plugins/highlighting-code-block/), akked [Persian](https://fa.wordpress.org/plugins/highlighting-code-block/). * [Translate into your language](https://translate.wordpress.org/projects/wp-plugins/highlighting-code-block) * Tags * [block](https://kab.wordpress.org/plugins/tags/block/)[code](https://kab.wordpress.org/plugins/tags/code/) [editor](https://kab.wordpress.org/plugins/tags/editor/)[Guternberg](https://kab.wordpress.org/plugins/tags/guternberg/) [syntax](https://kab.wordpress.org/plugins/tags/syntax/) * [Advanced View](https://kab.wordpress.org/plugins/highlighting-code-block/advanced/) ## Ratings 4.5 out of 5 stars. * [ 16 5-star reviews ](https://wordpress.org/support/plugin/highlighting-code-block/reviews/?filter=5) * [ 0 4-star reviews ](https://wordpress.org/support/plugin/highlighting-code-block/reviews/?filter=4) * [ 0 3-star reviews ](https://wordpress.org/support/plugin/highlighting-code-block/reviews/?filter=3) * [ 2 2-star reviews ](https://wordpress.org/support/plugin/highlighting-code-block/reviews/?filter=2) * [ 1 1-star review ](https://wordpress.org/support/plugin/highlighting-code-block/reviews/?filter=1) [Your review](https://wordpress.org/support/plugin/highlighting-code-block/reviews/#new-post) [See all reviews](https://wordpress.org/support/plugin/highlighting-code-block/reviews/) ## Contributors * [ LOOS ](https://profiles.wordpress.org/looswebstudio/) ## Support Got something to say? Need help? [View support forum](https://wordpress.org/support/plugin/highlighting-code-block/)