codeタグはHTMLをエスケープしてくれないから、code内にHTMLを書く時は自分でエスケープしなければならない

HTMLのcodeタグは、プログラミングコードを実行せずそのまま表示させるのに使います。

なので、そのままHTMLを書いたのですが、どうやらHTMLタグはエスケープされずそのまま実行されてしまうようです。

HTMLはプログラムではなくマークアップだからということか。

codeタグ内でHTMLタグをそのまま表示させるには、HTMLタグをエスケープしてから codeタグ内に記述する必要があります。

WordPressならブロックエディタのコードを使って挿入するとHTMLが自動にエスケープされて便利です。