설명

“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/

Source code

The source code of this plugin is available on Github.

URL: 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.

스크린샷

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

블록

이 플러그인은 1(을)를 제공합니다.

Highlighing Code Block

설치

This plugin can be installed directly from your site.

Log in and navigate to “Plugins” “Add New”.
Type “Highlighting Code Block” in the search field and press Enter.
Locate the plugin in the list of search results and click “Install Now”.
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

후기

DevAny 2024년 7월 15일 답글 1개

편집기와 미리보기 결과가 불일치 편집기에서 줄번호 비정상 표시 줄번호와 코드 영역 겹침

liuliu66 2024년 4월 14일

在寻求关于此问题的帮助时，您可能需要提供以下信息：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

sazone 2024년 3월 19일

read code easily

ishere 2023년 12월 17일

Very thanks!

Rouzbeh Zarei 2023년 11월 4일 답글 1개

Unfortunately, the plugin doesn’t support Java, Kotlin, Flutter nor XML syntax, making it completely useless for anyone in the Android development field.

Anonymous User 20287723 2023년 7월 25일

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.

모든 22 평가 읽기

기여자 & 개발자

“Highlighting Code Block”(은)는 오픈 소스 소프트웨어입니다. 다음의 사람들이 이 플러그인에 기여하였습니다.

“Highlighting Code Block”(이)가 4 개 언어로 번역되었습니다. 기여해 주셔서 번역자님께 감사드립니다.

자국어로 “Highlighting Code Block”(을)를 번역하세요.

개발에 관심이 있으십니까?

코드 탐색하기는, SVN 저장소를 확인하시거나, 개발 기록을 RSS로 구독하세요.

변경이력

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