この記事は現役ウェブディベロッパーがわかりやすさにこだわって作成しました
1. 設定
WordPressの管理画面サイドメニューより「設定」>「[HCB]設定」を選択。
基本設定
言語、行数、コピーボタンなどの表示・非表示設定。フォントやフォントサイズの変更。デザイン「Light」「Dark」の変更などができます。
使用できる言語
HTML CSS SCSS JavaScript TypeScript PHP Ruby Python Swift C C# C++ Objective-C SQL JSON Bash Git
高度な設定
使用する言語のセット、独自のCSSファイル、prism.jsファイルを指定することができます。
2. 使い方
※ブロックエディターの利用方法になります。
(1) 投稿画面のブロック追加より「Highlighting Code Block」を選択します。

Highlighting Code Blockが表示されます。※デザインはDarkに設定してあります。

(2) コードを貼り付けます
設定することでカスタマイズもできます。
-Lang Select – | 使用言語の設定 |
---|---|
ファイル名 | ファイル名の指定 |
data-line属性値 | ハイライト行数の指定。 例1,3,6 または4-8 |
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>テストHTML</title>
</head>
<body>
</body>
</html>
。

この記事についてのご質問またはお困りのことがございましたら、お気軽にお問い合わせください。