Cocoon(コクーン)の投稿ページにコードを表示させたい

自分のブログをカスタマイズしようとして、
他のブログの記事にあったコードをコピーすることがあると思います

その内容を残しておきたいときに、例えば下記のコードを

<?php else: ?>
<!--<figure class="eyecatch noimg">
<img src="<?php echo get_theme_file_uri('/library/images/noimg.png'); ?>">
<span class="cat-name cat-id-<?php echo $cat->cat_ID;?>"><?php echo $cat->name; ?></span>
</figure>-->
<?php endif; ?>

そのままテキスト欄に貼り付けるとこうなります


記事に表示されません
今度はビジュアル欄に貼り付けてみます

<?php else: ?>
<!–<figure class=”eyecatch noimg”>
<img src=”<?php echo get_theme_file_uri(‘/library/images/noimg.png’); ?>”>
<span class=”cat-name cat-id-<?php echo $cat->cat_ID;?>”><?php echo $cat->name; ?></span>
</figure>–>
<?php endif; ?>

一見正しく貼り付けられたように見えますが、公開ボタンを押して反映された記事は、
ハイフンやダブルクォーテーション、スペースが微妙に異なって表示されます
もしこの記事を参考にして誰かがコピーして使用しようとしても、
うまくいかない可能性が出てきます

コードを貼り付ける時は
①<pre><code>
</code></pre>で挟み(これは他の方法がありそうな気もするのですが)
②「<」と「>」を「&lt;」と「&gt;」に置き換えてください

___________
備忘録
&→&amp;