はじめに
クラシックエディタのCode Blockに複数行のコードをコピペする時に、
空白行が含まれると、Code Block内にうまくペーストすることができません。
この記事では、複数行のコードでもCode Blockにきれいにコピペする方法をご紹介します。
Highlight Code Blockのインストールがまだの方はこちらをご覧ください！
【WordPress】ソースコードを見やすく表示する「Highlighting Code Block」
Wordpressでソースコードを見やすく表示する際に便利なプラグイン「Highlighting Code Block」の使い方をご紹介します。Cocoonのクラシックエディタを使用している場合について説明します。
shungoblog.com
複数行のコードをコピペする方法
Code Blockを導入する
まずはクラシックエディタでCode Blockを挿入します。
ビジュアル => テキスト に変更する
次にビジュアルからテキストに変更します。
ビジュアルのままコピペすると空白行がうまく反映されないので注意してください。
codeタグの間にコードをコピペする
テキストに切り替わったら、/* Your code... */を削除して、表示したいコードをコピペします。
例えば、このようにHTMLのコードをコピペすると
空白行もうまく反映されていると思います！
<h2>Title</h2>
<p>Text</p>
<footer>
<p>© 2023 shungoblog</p>
</footer>