WordPress:プログラムコードの強調表示ができるプラグイン「Highlighting Code Block」

Highlighting Code Block は、記事にコードのハイライト（強調表示）でき、日本語対応もしている日本人には使用しやいプラグインです。

Highlighting Code Blockプラグインのインストール

「Highlighting Code Block」プラグインを利用するには、管理画面のサイドバーにある「プラグイン」⇒「新規追加」を開き、「Highlighting Code Block」と検索すると表示されます。

プラグインを使用するには、インストールをして有効化すると、ダッシュボードのサイドメニューの設定に［HCB］設定 が追加されます。

プラグイン詳細：Highlighting Code Block

Highlighting Code Blockの設定・使用方法

ブロックエディターに、「HCB」ブロックが追加されます。

「HCB」ブロックでは、コードを入力すること以外に、言語設定（Lang Select）、強調したいライン（date-line属性値）の設定ができます。

date-line属性値の設定例

下の例のように強調したい行を数字で細かく設定できる仕組みがあります。

• 1行：1
• 複数行：2,4,5
• 複数行：3-5

ブロックの設定

ブロックでは、行番号と言語名の表示の有無を設定でき、デフォルトで表示される設定になっています。

Highlighting Code Block の設定ページ

プラグインは、基本設定のままで使用でき、言語、行数の表示の有無の設定、フォントサイズの設定などができます。

• WordPress:コードを記事でハイライト表示できるプラグイン「Enlighter – Customizable Syntax Highlighter」
• WordPressでGoogleマップを表示できるプラグイン「Gutenberg Map Block for Google Maps」
• WordPressにYouTubeを埋め込めるプラグイン「Embed Plus for YouTube」の使い方
• シンプルなソーシャル・共有ボタンのプラグイン「Simple Share Buttons Adder」
• 投稿記事・ページにHTML・JS・PHPコードを挿入できるプラグイン「Code Insert Manager」
• 訪問者が見た他ページを表示するプラグイン「Where did they go from here」
• WordPress投稿記事に印刷ボタンを追加できるプラグイン「WP-Print」
• 印刷、PDFファイルとしてダウンロードできるプラグイン「Print Friendly and PDF」