[ 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 の環境設定画面

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

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

スポンサーリンク

↓この記事が気に入ったら、ぜひシェアをお願いします!

↓ブログをフォローすると更新情報が届きます。

スポンサーリンク

コメント

  1. 匿名 より:

    アップデートが加わったようで、 italicを消しただけだと斜体が変わりませんでした。

    font-sylteにノーマルを記載すると斜体が解除できました。 もし、うまくいかない方がいれば試してみてください。

    .cm-comment {color: #697475; font-style:normal;}

  2. 管理人 より:

    コメントありがとうございます! Dreamweaver をアップデートしたら試してみます。