[ Dreamweaver CC 2017 ] ソースコード内のコメント斜体表示解除・行間設定・折りたたみ設定の変更方法

[ Dreamweaver CC 2017 ] で、ソースコードの表示方法を変更したのでご紹介します。

ソースコード内のコメントのイタリック（斜体）表示をやめる
———————————————————————-

ソースコード内のコメントは、デフォルトだとイタリック体（斜体）で表示されます。
英語コメントだと良いのかもしれませんが、日本語のコメントが斜体だと非常に読みにくいので修正します。

Dreamweaver CC 2017 では、環境設定に [ コードカラーリング ] という設定が無くなっているためソースコードのスタイルを変更できません。

ソースコードのスタイルを変更するには、下記のファイルを直接編集する必要があります。
※ 念のためオリジナルファイルのバックアップをお奨めします。

C:\Program Files\Adobe\Adobe Dreamweaver CC 2017\www\extensions\default\DarkTheme\main.less

ソースコード内のコメントのイタリック表示をやめるには、90 行目にある次の部分を書き換えます。

変更前　.cm-comment {color: #717171; font-style: italic;}
変更後　.cm-comment {color: #717171; /*font-style: italic;*/}

編集後はファイルを保存して、Dreamweaver CC 2017 を再起動すると設定が反映されます。

ソースコードの行間を広くする
———————————————————————-

デフォルトの行間は狭く、読みづらかったので修正します。

ソースコードの行間を広くするには、上記の設定ファイルの末尾に下記のスタイルを加えます。

.CodeMirror {
line-height: 1.5;
}

こちらも、編集後はファイルを保存して、Dreamweaver CC 2017 を再起動すると設定が反映されます。

コードの折りたたみを無効にする
———————————————————————-

行番号の横に ▼ マークがたくさん表示され見にくかったので非表示にします。

1. [ 編集 ] → [ 環境設定 ] をクリックします。
2. [ カテゴリー ] リストの [ コードフォーマット ] をクリックし、[ コード折りたたみ最小サイズ ] を [ 99999 ] 指定します。※ デフォルトは [ 2 ] です。

▲ Dreamweaver CC 2017 の環境設定画面

こちらも、設定変更後は Dreamweaver CC 2017 を再起動すると設定が反映されます。

以上です。ソースコードが見やすくなって良かった。