今回は下記のようなコードを見やすく色付けしてくれる、JSライブラリのhighlight.jsをWordPressに導入する、私なりのやり方をご紹介。

function abc() {
  const btn;

  btn.addEventListener('click', () => {
    btn.parentNode.classList.add('active');
  )};

  return 0;
}

highlight.jsの詳しいことは下記サイトを御覧いただき、ここでは要点だけ説明します。

コードのハイライト表示用 JS ライブラリ highlight.js の使い方（Qiita）

https://qiita.com/tadnakam/items/99088d78512a20e75ff3

やり方は簡単で、下記をheader.phpのheadタグに書くだけ！

  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/monokai-sublime.min.css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/languages/go.min.js"></script>
  <script>hljs.highlightAll();</script>

文字の色（パレット）は一行目のmonokai-sublime.min.cssを変更すれば、好みのものに変えることができます。種類については引用先で紹介されているのでそちらを参考にしてくださいー