Bloggerの記事内にソースコードを貼る方法

カスタマイズ記事を書く際に必要なのが、記事内にソースコードを貼り付けること。

調べてみるといろいろとやり方があるそうですが、今回ご紹介するのは私が使用している方法です。

Bloggerの場合はそのままソースコードを貼ることができないので、エンコード？　っていうのですかね？　それをする必要があります。

手打ちだと大変面倒なので、ソースコードを自動で変換してくれるWEBツールを利用します。

参考：ソースコード変換 < & ” > br改行　WEB用に自動エスケープ

こちらで生成されたコードを貼り付けるだけでOK。

あとはCSSを追加しておきます。以下のコードを貼り付けてそのまま使っていただいても大丈夫ですし、加工していただいても大丈夫です。

.date-posts pre {
    word-wrap: break-word;
    border: 1px solid #dddddd;
    margin: 0 0 10px;
    padding: 20px;
    white-space: pre-wrap;
}

これでおそらく問題ないはずです。