Guide d'utilisation Annuler

Formatage du code

Rechercher

Dernière mise à jour le 2 mai 2021

Vous pouvez définir des préférences qui contrôlent la mise en forme de votre code chaque fois que vous créez ou modifiez un fichier.

Formatage manuel de code

Ouvrez un fichier pris en charge.
Sélectionnez Modifier > Code > Appliquer le format source.

Ou, sélectionnez Appliquer le format source à partir de Barre d’outils Commun > Mise en forme du code source.

Formatage manuel de code sélectionné dans un fichier

Ouvrez le code.
Sélectionnez une partie quelconque du code.
Sélectionnez Modifier > Code > Appliquer le format source à la sélection.

Ou, sélectionnez Appliquer le format source à la sélection à partir de Barre d’outils Commun > Mise en forme du code source.

Remarque :

Si vous sélectionnez un code entre des balises et appliquez le formatage source à la sélection, le formatage est appliqué jusqu’à la balise parent.

Modification des règles par défaut pour le formatage du code

Vous pouvez personnaliser les formats de code CSS, JS et PHP en ajoutant des règles de formatage dans le fichier .jsbeautifyrc dans le dossier racine de votre site.

Pour ajouter le fichier .jsbeautifyrc, procédez comme suit :

Remarque :

Les instructions suivantes s’appliquent uniquement pour les documents CSS, JS et PHP.
Les balises HTML dans un document PHP sont formatées selon les préférences dans les bibliothèques de balises. Vous pouvez formater le code dans des blocs PHP à l’aide des instructions ci-dessous.

Créez un nouveau fichier à la racine du site avec le nom de fichier .jsbeautifyrc.

Copiez-collez les règles de formatage par défaut ci-dessous pour le code CSS, JS ou PHP dans le fichier .jsbeautifyrc et enregistrez le fichier.

{ 
 
    "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 
 
    } 
 
}

Modifiez les règles par défaut pour modifier les règles de formatage du code par défaut conformément au tableau ci-dessous et enregistrez les modifications.
Redémarrez Dreamweaver et appliquez le formatage du code pour un fichier CSS, JS ou PHP.

Le code est formaté conformément aux règles de formatage mises à jour.

Remarque :

Si vous souhaitez personnaliser le formatage du code pour les fichiers PHP, CSS ou JS dans d’autres sites Dreamweaver, vous devez placer le fichier personnalisé .jsbeautifyrc dans le dossier racine du site.

Règles de formatage CSS, JS et PHP :

CSS	Règles	Valeurs par défaut dans Dreamweaver	Description
	preserve_newlines	false	Pour conserver des lignes vides.
	selector_separator_newline	false	Pour placer une nouvelle ligne entre des sélecteurs séparés par une virgule. Par exemple : « .div, .P »
	end_with_newline	false	Pour terminer le fichier avec une ligne vide.
	newline_between_rules	false	Pour ajouter une nouvelle ligne après chaque règle CSS.
	space_around_selector_separator	true	Pour garantir un espace autour de séparateurs de sélecteur : >, +, ~ Par exemple : « a>b » deviendrait « a > b » lors de l’application du formatage source.

JS	Règles	Valeurs par défaut dans Dreamweaver	Description
	« eol »	« \n »	Caractère utilisé pour représenter une fin de ligne.
	preserve_newlines	true	Pour conserver des lignes vides.
	max_preserve_newlines	3	Pour « max_preserve_newlines » : N, N-1 lignes vides sont conservées lors de l’application du formatage lorsque plus de N-1 lignes vides sont présentes dans le fichier JS. Remarque : max_preserve_newlines n’est applicable que si preserve_newlines est défini sur true.
	space_after_anon_function	true	Pour ajouter un espace avant une parenthèse de fonction anonyme. Par exemple : « function() » deviendrait « function () » lors de l’application du formatage source.
	keep_array_indentation	false	Autorise ou conserve une nouvelle ligne dans le corps du tableau.
	space_before_conditional	true	Pour ajouter un espace avant une instruction conditionnelle. Par exemple : « if(true) » deviendrait « if (true) » lors de l’application du formatage.
	break_chained_methods	false	Autorise ou conserve une nouvelle ligne entre des fonctions concaténées. Par exemple : `foobar().baz()`
	unescape_strings	false	Si des caractères imprimables dans des chaînes codées en notation \xNN doivent être sans caractères d’échappement. Par exemple : « \x65\x78\x61\x6d\x70\x6c\x65 » deviendrait « exemple » lors de l’application du formatage source.
	wrap_line_length	0	Les lignes doivent se terminer à la prochaine occasion après ce nombre de caractères.
	end_with_newline	true	Pour garantir qu’une nouvelle ligne est ajoutée à la fin du fichier.
	comma_first	false	Lors de la rupture d’une ligne à la virgule, cet indicateur est utilisé pour garantir que la virgule est le premier caractère de la ligne.
	operator_position	after-newline	Si une expression conditionnelle longue est divisée en plusieurs lignes, cet indicateur est utilisé pour définir la position des opérateurs dans les lignes. Vous pouvez modifier l’indicateur avec les valeurs ci-dessous : before-newline after-newline preserve-newline

Remarque :

Les règles pour le formatage PHP sont les mêmes que pour le formatage JS (décrit dans le tableau ci-dessus) avec deux règles supplémentaires données ci-dessous :

PHP

Règles

Valeurs par défaut dans Dreamweaver

Description

brace_style

collapse

Vous pouvez contrôler la position des accolades avec cette option :

Par exemple :

function f() {

// code

}

function f()

{

// Code

}

Vous pouvez affecter les valeurs ci-dessous :

« collapse » - placer les accolades sur la même ligne que les instructions de contrôle
« expand » - placer les accolades sur leur propre ligne (style Allman / ANSI)
« end-expand » - placer les accolades aux extrémités sur leur propre ligne
« none » - essayer de les garder où elles sont
n’importe laquelle des valeurs précédentes + « ,preserve-inline » - la valeur preserve-inline tente de conserver les blocs d’accolades intégrés

space_in_paren

true

Pour ajouter des espaces à l’intérieur des parenthèses.

Par exemple :

include(’header.php’)

deviendrait

include( ’header.php’ ) lors de l’application du formatage