いろいろブログカスタマイズメモ

はてなブログのカスタマイズ、書き方などのメモ、チートシートです。／※本サイトはアフィリエイトプログラムによる収益を得ています。ページ内のリンクがアフィリエイトリンクの場合があります。

2016-09-03

Markdownのコード配色を変更する

デザイン

※本サイトはアフィリエイトプログラムによる収益を得ています。
　ページ内のリンクがアフィリエイトリンクの場合があります。

　はてなブログのMarkdown記法で使っているソースコードの配色を変えます。

　デフォルトでは背景黒のものなのですけど、個人的には白が好みなのです。

CSSの変更をする

　例えば変更前はJavaだとこんな感じ。

f:id:kagerou_ts:20160903114847p:plain

　こちらのサイトを参考にしてCSSを変更していきます。

kerotaa.hateblo.jp

　というか、元々のデフォルトが個人的にはそれでいいかなあという感じだったので…

 .entry-content pre.code {
    background-color: #f5f5f5 ;
    color: #657b83 ;
}
.synSpecial { color: #c000c0; }
.synType { color: #3EC63E; }
.synComment { color: #4F80E5; }
.synPreProc { color: #9355E6; }
.synIdentifier { color: #51CFCF; }
.synConstant { color: #FF6666; }
.synStatement { color: #D88A17; }

という感じに戻して、背景色だけ変えました。

　これを、「デザイン > カスタマイズ > デザインCSS」に追加します。

f:id:kagerou_ts:20160903114924p:plain

こうなりました。

CSSの変更をする

© 2016 はてなブログカスタマイズメモ