ソースコードを装飾する

問題点

ソースコードをそのままWordPressで表示しようとすると、特殊文字によって意図しない表示のされ方をしてしまう。
加えて、ソースコードを表示する際、サイトにもよるがターミナルのように真っ黒な背景に表示していたり、ボタン一つ押すと丸ごとコピーできたりと、色々パターンはあるがとにかくカッコいい感じになっているサイトが多い。

調査~プラグイン探し~

最初は「Crayon Syntax Highlighter」というものを使おうと思ったが、もう3年とかそういったレベルでメンテされておらず、一旦インストールしたものの、「Classic Editor」で以前のWordPressエディターを使わないと駄目っぽかったりと色々問題ありそうだった。
なので「SyntaxHighlighter Evolved」というものを使うことにしました。※名前似ていますが作成者は異なるので後継ではない?

作業記録~SyntaxHighlighter Evolvedのインストール、設定~

インストール、使い方は超簡単。
インストールはプラグイン追加で名前検索すれば出てきます。
使い方は、ブロック追加するときにフォーマットでSyntax Highlighterコードを選択するだけ。
その際にコード言語を選べます。
BASH/Shellを選択。
下記のように色が付き、カッコよく見えます。

#!/bin/bash

echo "Hello World !"

exit 0

あと、多少設定いじっておいたほうがいいかも。
SyntaxHighlighterのバージョンは、バージョン2.xとバージョン3.xを選べますが、折り返してくれるバージョン2.xの方がよいかもです。
あとはテーマ。デフォルトだと背景が白なのですが、Emacsとか背景真っ黒の方がターミナルっぽくなってオススメです。