マニュアルキャンセル

コードのフォーマット

検索

最終更新日 : 2021年4月28日

Dreamweaver

アプリを開く

環境設定を行うことで、ファイルの作成時または編集時にコードに適用されるフォーマットを制御できます。

コードの手動フォーマット

サポートされているファイルを開きます。
編集／コード／ソースフォーマットの適用を選択します。

または、一般ツールバー／ソースコードのフォーマットからソースフォーマットの適用を選択します。

選択したコードの手動フォーマット

コードを開きます。
コードの任意の部分を選択します。
編集／コード／ソースフォーマットを選択範囲に適用を選択します。

または、一般ツールバー／ソースコードのフォーマットからソースフォーマットを選択範囲に適用を選択します。

注意：

タグの間にあるコードを選択し、その選択範囲にソースフォーマットを適用すると、親タグまでフォーマットが適用されます。

コードフォーマットのデフォルトのルールの編集

CSS、JS および PHP コードのフォーマットは、サイトのルートフォルダーの .jsbeautifyrc ファイルにフォーマットルールを追加することでカスタマイズできます。

.jsbeautifyrc ファイルを追加するには、次の手順に従います。

注意：

次の手順は、CSS、JS および PHP ドキュメントにのみ適用されます。
PHP ドキュメント内の HTML タグは、タグライブラリの環境設定に従ってフォーマットされます。PHP ブロック内のコードは、次の手順でフォーマットすることができます。

サイトのルートに .jsbeautifyrc という名前の新しいファイルを作成します。

以下に示す CSS、JS および PHP のデフォルトのフォーマットルールをコピーし、.jsbeautifyrc に貼り付けて、ファイルを保存します。

{ 
 
    "js": { 
 
        "eol": "\n", 
 
        "preserve_newlines": true, 
 
        "max_preserve_newlines": 3, 
 
        "space_after_anon_function": true, 
 
        "keep_array_indentation": false, 
 
        "space_before_conditional": true, 
 
        "break_chained_methods": false, 
 
        "unescape_strings": false, 
 
        "wrap_line_length": 0, 
 
        "end_with_newline": true, 
 
        "comma_first": false, 
 
        "operator_position": "after-newline" 
 
    }, 
 
    "css": { 
 
        "preserve_newlines": false, 
 
        "selector_separator_newline" : false, 
 
        "end_with_newline": false, 
 
        "newline_between_rules": false, 
 
        "space_around_selector_separator": true 
 
    }, 
 
    "php": { 
 
        "eol": "\n", 
 
        "preserve_newlines": true, 
 
        "max_preserve_newlines": 3, 
 
        "space_after_anon_function": true, 
 
        "brace_style": "collapse", 
 
        "keep_array_indentation": false, 
 
        "space_before_conditional": true, 
 
        "break_chained_methods": false, 
 
        "unescape_strings": false, 
 
        "wrap_line_length": 0, 
 
        "end_with_newline": false, 
 
        "comma_first": false, 
 
        "space_in_paren":true 
 
    } 
 
}

以下の表を参照してデフォルトのコードフォーマットルールを編集し、変更を保存します。
Dreamweaver を再起動し、CSS、JS および PHP ファイルにコードフォーマットを適用します。

更新されたフォーマットルールに従ってコードがフォーマットされます。

注意：

他の Dreamweaver サイトにある PHP、CSS および JS ファイルのコードフォーマットをカスタマイズする場合は、カスタマイズした .jsbeautifyrc ファイルを、目的のサイトのルートフォルダーに配置する必要があります。

CSS、JS および PHP のフォーマットのルール

CSS	ルール	Dreamweaver のデフォルト値	説明
	preserve_newlines	false	空白行を保持するかどうかを指定します。
	selector_separator_newline	false	コンマで区切られたセレクター間に改行を挿入するかどうかを指定します。例：".div, .P"
	end_with_newline	false	ファイルの終わりに空白行を挿入するかどうかを指定します。
	newline_between_rules	false	各 CSS ルールの後に改行を追加するかどうかを指定します。
	space_around_selector_separator	true	セレクターの区切り（「>」、「+」、「~」）の前後に空白を挿入します。例："a>b" は、ソースフォーマットを適用すると "a > b" になります。

JS	ルール	Dreamweaver のデフォルト値	説明
	"eol"	"\n"	行末を表す文字を指定します。
	preserve_newlines	true	空白行を保持するかどうかを指定します。
	max_preserve_newlines	3	"max_preserve_newlines": N とすると、 JS ファイルに N 行以上の空白行が存在する場合、フォーマットの適用時に N-1 行の空白行が保持されます。注意：max_preserve_newlines は、preserve_newlines が true に設定されている場合にのみ適用されます。
	space_after_anon_function	true	匿名関数の丸カッコの前にスペースを追加するかどうかを指定します。例："function()" は、ソースフォーマットを適用すると "function ()" になります。
	keep_array_indentation	false	配列本体の内部での改行を許可または保持します。
	space_before_conditional	true	条件ステートメントの前に空白を追加するかどうかを指定します。例："if(true)" は、フォーマットを適用すると "if (true)" になります。
	break_chained_methods	false	連鎖関数の間の改行を許可または保持します。例： `foobar().baz()`
	unescape_strings	false	\xNN 表記でエンコードされた文字列内の出力可能な文字をエスケープ解除します。例： "\x65\x78\x61\x6d\x70\x6c\x65" は、ソースフォーマットを適用すると "example" になります。
	wrap_line_length	0	指定した文字数を超えた場合に、適切な位置で行を折り返します。
	end_with_newline	true	ファイルの終わりに改行を追加します。
	comma_first	false	このフラグを設定すると、コンマの位置で改行する場合に、常にコンマが行の先頭文字になります。
	operator_position	after-newline	このフラグは、長い条件式が複数行に分割される場合に、各行での演算子の位置を定義するために使用します。このフラグには次の値を指定できます。 before-newline after-newline preserve-newline

注意：

PHP フォーマットのルールは JS フォーマット（上記の表で説明）と同じですが、次の 2 つのルールが追加されます。

PHP

ルール

Dreamweaver のデフォルト値

説明

brace_style

collapse

このオプションを使用して波カッコの位置を制御できます。

例：

function f() {

// コード

}

または

function f()

{

// コード

}

次の値を割り当てることができます。

"collapse" - 条件ステートメントと同じ行に波カッコを配置します
"expand" - 波カッコを単独の行に配置します（オールマン／ANSI スタイル）
"end-expand" - 閉じ波カッコを単独の行に配置します
"none" - 記述されたとおりの位置に保持します
上記のいずれか + ",preserve-inline" - preserve-inline は、インラインブロックの波カッコをそのままに保ちます

space_in_paren

true

丸カッコ内にスペースを追加するかどうかを指定します。

例：

include('header.php') は、

フォーマットを適用すると

include( 'header.php' ) になります

その他の関連ヘルプ

コードフォーマットの変更

ヘルプをすばやく簡単に入手

新規ユーザーの場合

Adobe MAX Japan
クリエイターの祭典

2025 年 2 月 13 日
東京ビッグサイト

詳しく見る