限りなく院生に近いパリピ@エストニア

エストニアという国で一人ダラダラしてます。

はてなブログにソースコードを貼る方法(メモ)

適当に実装したものもメモとしてこのブログに残しておきたいと思ったのだが、

そもそもはてなブログへのソースコードの貼り方、埋め方を知らなかったので、とても簡単に調べて、簡単にまとめておこう。

 

 

まず、前提として

はてなブログソースコードをそれっぽく表示するには、

htmlで<pre><code>と</pre></code>の間に表示させたいソースコードを入れるのが一番簡単な方法だと思う。

 

 

もっと見やすい出し方とかもあるが、僕はそこまでエナジーを注ぎたくはないので、

<pre><code>ソースコード</pre></code>

の一強でしばらくいきたい。

 

 

f:id:T_I_SHOW:20170915031633p:plain

画像の赤丸で囲んである部分からHTML編集に飛んで、

f:id:T_I_SHOW:20170915031831p:plain

と打ち込めば、例えばCSSなら下のように簡易的な表示が可能。なるほど。

.entry-content h3{ 
padding: 5px 10px; 
border-left: 10px solid #fc0;
}

色をつけたりする場合は、別の方法の方が良いかも?!