はてなブログにソースコードを貼り付ける方法
htmlやJava、C言語などのソースコードをはてなブログに表示させたいと言う方も多いと思います。
今回は、ソースコードの部分だけ色を付け、綺麗に表示する方法を紹介します。
はてなブログ以外の場合でもやり方は一緒なので参考にして下さい。
表示方法
- はてな記法を使用する方法（はてなブログ用？）
- htmlコードを使用する方法（どのブログでも使用可？）
はてな記法を使用する方法
>|| ||<
でコードを囲って下さい。
これははてなブログでする場合のみしか使えないかもしれません。
はてなブログで使用する場合は、「はてな記法」をONにしてください。
「設定」→「編集モード」から設定できます。
htmlコードを使用する方法
<pre><code></code></pre>
でコードを囲って下さい。これで囲ったコードをhtml編集の部分に貼り付けて下さい。
以下に例を示します。
例えば、
h3{
font-size: 120%;
margin:5px 0px;
padding:2 2 2px 2px;
}
のようなコードをブログに表示させるとします。これを「<pre><code></code></pre>」で囲むだけで以下のようになります。
h3{
font-size: 120%;
margin:5px 0px;
padding:2 2 2px 2px;
}以上で終わりです。
まとめ
ソースコードを表示させるときはこのような方法を使用することで、他サイトで見るようなソースコードの表示方法を実現できます。
