widows7 環境で Brackets に Source Han Code JP を設定する

関係各所でワォ！ 革命的！ って言われてしゃーないコーディング用のフォント「Source Han Code JP」を愛用のブラケッツちゃんに設定しようと思って、地味に詰まったので、シェアメモ。

コーディングに最適な日本語対応の等幅フォントSource Han Code JPとは – ICS LAB

書体のダウンロードは→Release Fonts version 1.002 (OTF, OTC) · adobe-fonts/source-han-code-jp · GitHub

widows7 環境の Brackets に設定

ツールバーの[表示]→[テーマ]

で、「フォントファミリー」の入力欄に

'SourceHanCode-Medium', ＭＳ ゴシック, 'MS Gothic', monospace

を、設定。しても動かなかった。僕の環境では。

なので、

'Source Han Code jp Medium'こうやってスペースを入れて入力したら通った。

コード書く感覚で記事を書くべく、WordPressの投稿画面にも反映

こうなったらどうせなので、WordPressの投稿画面部分にも突っ込んでみた。

まずはfunctions.phpに

これで管理画面にCSSを充てられるので、テーマ内にeditor-style.cssを用意して

.wp-editor-area {
font-family: 'SourceHanCodeJP-Medium',
'源ノ角ゴシック Code JP Medium',
'SourceCodePro-Regular',
'Source Code Pro',
Consolas,Monaco,monospace !important;
}

すでに書体が設定されているのでいちいち!importantがしんどいけども。

WordPressもEmmet環境なので、そこそこ快適にコードもかけるぞと、視認性が良いので、文字打つのもなかなか捗る気がします。

BracketsにSource Han Code JPを設定してみてどうか

うーん、こればっかりはなんとも言えないけど、視認性は確かに高いんだが、コードをガリガリ書いてるぜ！　オルァ！感は正直ちょい低いかな。感覚ですが。

ただ、

コードを折りたたむ▼がでかくなったのは評価したい。

見やすいってのは目が疲れないから、長時間画面見てコードをアレする人にはいいかもしれませんね。

お試しあれ。

ついでにWordPressの投稿画面にも当てました。快適。

文：シンタロヲフレッシュ

はてブ

pocket

twitter