[ 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 を再起動すると設定が反映されます。

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

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

▲ Dreamweaver CC 2017 の環境設定画面

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

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

現場からは以上です。それでは、またッ！！！

だるかぶ

最後までお読みいただきありがとうございます！スキ・コメント・シェア・フォローなどで応援いただけると『だるかぶ』のやる気がアップします！

記事内容の修正について 記載している内容は記事執筆時の情報です。できるだけ最新情報を掲載するようにしていますが、情報が間違っている場合は「コメント」でご指摘いただけるとありがたいです。