Beschrijving
“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.
Als het niet werkt
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.
Schermafbeeldingen
[Code kleuren]
Code kleuren
[Select Highlighing Code Block]
Select Highlighing Code Block
[Select lang (Guternberg)]
Select lang (Guternberg)
[Writing your code (Guternberg)]
Writing your code (Guternberg)
[Added select box (Tinymce)]
Added select box (Tinymce)
[Select lang (Tinymce)]
Select lang (Tinymce)
[Writing your code (Tinymce)]
Writing your code (Tinymce)
[ex) Light color]
ex) Light color
[bv) donkere kleur]
bv) donkere kleur
[Basisinstelling]
Basisinstelling
[Higher Setting]
Higher Setting
Blokken
Deze plugin heeft 1 blok.
- Highlighing Code Block
Installatie
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
Beoordelingen
Bijdragers & ontwikkelaars
“Highlighting Code Block” is open source software. De volgende personen hebben bijgedragen aan deze plugin.
Bijdragers
![[]](https://ps.w.org/highlighting-code-block/assets/banner-772x250.png?rev=2432522){kind=link}
![[]](https://ps.w.org/highlighting-code-block/assets/icon-256x256.png?rev=2432522){kind=link}
![[Code kleuren]](https://ps.w.org/highlighting-code-block/assets/screenshot-1.png?rev=2432522){kind=link}
![[Select Highlighing Code Block]](https://ps.w.org/highlighting-code-block/assets/screenshot-2.png?rev=2432522){kind=link}
![[Select lang (Guternberg)]](https://ps.w.org/highlighting-code-block/assets/screenshot-3.png?rev=2432522){kind=link}
![[Writing your code (Guternberg)]](https://ps.w.org/highlighting-code-block/assets/screenshot-4.png?rev=2432522){kind=link}
![[Added select box (Tinymce)]](https://ps.w.org/highlighting-code-block/assets/screenshot-5.png?rev=2432522){kind=link}
![[Select lang (Tinymce)]](https://ps.w.org/highlighting-code-block/assets/screenshot-6.png?rev=2432522){kind=link}
![[Writing your code (Tinymce)]](https://ps.w.org/highlighting-code-block/assets/screenshot-7.png?rev=2432522){kind=link}
![[ex) Light color]](https://ps.w.org/highlighting-code-block/assets/screenshot-8.png?rev=2432522){kind=link}
![[bv) donkere kleur]](https://ps.w.org/highlighting-code-block/assets/screenshot-9.png?rev=2432522){kind=link}
![[Basisinstelling]](https://ps.w.org/highlighting-code-block/assets/screenshot-10.png?rev=2432522){kind=link}
![[Higher Setting]](https://ps.w.org/highlighting-code-block/assets/screenshot-11.png?rev=2432522){kind=link}
“Highlighting Code Block” is vertaald in 5 localen. Dank voor de vertalers voor hun bijdragen.
Vertaal “Highlighting Code Block” in je eigen taal.
Interesse in ontwikkeling?
Bekijk de code, haal de SVN repository op, of abonneer je op het ontwikkellog via RSS.
Changelog
2.2.1
- Security: Fixed a stored XSS vulnerability via the plugin settings.
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-startattribute 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
- Ondersteuning voor WordPress 6.1.
1.6.0
- Ondersteuning voor WordPress 6.0.
1.5.5
- Opgelost het versienummer.
1.5.4
1.5.3
- Opgelost een bug.
1.5.2
- Fixed the problem of misaligned lines in some themes.
1.5.1
- Opgelost een 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
- Ondersteuning voor 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 oplossing.
1.2.7
- Added copy button function.
- Code herstructurering.
- Ondersteuning voor 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
Opgelost registerblok.
1.2.3
Opgelost block.json bestand.
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
Opgelost vertaalbestand.
1.0.9
Opgelost vertaalbestand.
1.0.8
Engels wordt ondersteund.
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
- Ondersteuning voor WordPress 5.2.1
- Changed font-family of code block.
- The file name can be set to the code block.
1.0.3
Ondersteuning voor WordPress 5.1.1
1.0.2
readme.txt wijziging
1.0.1
Commentaar verwijdering.
1.0
Initile release.