はてなブログでコードを楽に載せる方法（見たままモードで簡易的な方法）

はてなブログでプログラムのコードを載せる場合結構面倒だったりする。

はてなブログでプログラムのコードを楽に載せる方法

 はてなブログでプログラムのコード（またはHTMLソース・CSSなど）をきれいに載せるには、はてな記法モードではてな記法を使う方法や、Gistと言う外部サービスを引用する方法がある。

しかし、普段見たままモードを使って記事を書いている人は、はてな記法に変更して書いたり外部サービスを使うのは結構面倒。

と言うことで、見たままモードのまま簡易的にコードを載せる方法。

HTML編集で<pre></pre>タグの間にコードを書けばそれっぽくなる。 

つまり、<pre>タグを利用すればコードをそのまま載せることができると言う話。 

<pre>

ここにコードを描く
HTML編集でも改行はそのまま反映される

echo "HelloWorld" ;

</pre>

↑をHTML編集に書くと↓の表示になる。

ここにコードを書く
HTML編集でも
改行はそのまま反映される
自動改行（折り返し）はされない
**********************************************************************************************************************************************************************************
echo "HelloWorld" ;

こういう感じでpreタグの内は枠が付いて、枠内は自動改行（折り返し）が無効になる。

これでコードをそのまま載せることができる。

見たままモードだと何かとズレやすいので、プレビューや記事公開後の表示確認を忘れずに。