Cliquez sur Édition > Préférences (sous Windows) ou Dreamweaver > Préférences (sur Mac).
Dernière mise à jour le
27 avr. 2021
Apprenez à réduire et développer du code sous Dreamweaver pour visualiser des parties de votre document sans avoir recours au défilement.
Vous pouvez masquer (également appelé replier) et développer les fragments de code pour afficher différentes sections de votre document sans faire défiler.
Par exemple, pour voir toutes les règles CSS dans la balise head qui s'appliquent à une balise div plus bas sur la page, repliez le code entre la balise head et la balise div pour voir les deux sections de code en même temps.
Vous pouvez sélectionner une partie de code afin de le réduire. Vous pouvez également réduire du code dans des fichiers HTML, PHP, XML et SVG sur la base de blocs de balise. Dans les fichiers CSS, Less, Sass, SCSS et JS, vous pouvez réduire le code en fonction des accolades.
- Fichiers HTML : Dreamweaver réduit le code placé entre des balises HTML d’ouverture et de fermeture, et les attributs initiaux, le cas échéant, s’affichent dans le code réduit. Adobe Dreamweaver développe automatiquement lorsque le code dans le bloc reçoit le thème via le sélecteur de balise, Rechercher et remplacer, Aller à la ligne, Affichage rapide d'élément, Affichage en direct ou Annuler/Rétablir.
Si la sélection change, le code est automatiquement réduit à nouveau.
- Fichiers CSS, Less, Sass, SCSS et JS : le code dans les accolades est réduit et l'aperçu s'affiche comme {...}.
- Fichiers PHP : outre les blocs de code PHP, les éléments HTML ainsi que les blocs de code CSS et JS sont réduits.
Annotation
le code des fichiers créés à partir de modèles Dreamweaver est toujours affiché en mode développé, même si le modèle (*.dwt) contient des fragments de code réduits.
Définition des préférences de taille de pliage de code
La taille de pliage de code par défaut est deux lignes. Avec ce paramètre par défaut, tous les fragments de code qui contiennent au moins deux lignes de code peuvent être réduits. Les fragments de code de moins de deux lignes peuvent être réduits en sélectionnant le code.
Pour modifier le nombre minimal de lignes pour le repliement de code :
Cliquez sur Format de code dans la liste Catégorie et spécifiez la taille minimale de repliement de code.
Réduction et développement de fragments de code
Par défaut, tout le code en mode Code est en mode développé.
Toutefois, vous pouvez réduire le code en sélectionnant plusieurs lignes et en les réduisant. Vous pouvez également réduire le code en fonction de la syntaxe - blocs de balises ou accolades.
Annotation
les états réduits ou développés des blocs de code sont conservés dans les différentes sessions de Dreamweaver.
Réduction de code en fonction de blocs de balise ou d’accolades
Pour réduire le code en fonction des blocs de balises ou des accolades :
En mode Code, un petit triangle apparaît à côté des numéros de ligne correspondant aux blocs de code supérieurs au nombre de lignes de repliement de code spécifié dans les préférences de taille de repliement de code.
Cliquez sur ce triangle pour réduire ou développer le code.
Annotation
Pour développer tout le code réduit dans le document, vous pouvez utiliser le raccourci clavier Ctrl+Alt+E (Windows) ou Commande+Alt+E (Mac).
Réduction de code en fonction de la sélection
Pour réduire le code en fonction de la sélection :
En mode Code, sélectionnez le fragment de code que vous souhaitez réduire.
Cliquez sur l'icône triangle qui apparaît pour réduire et développer la sélection.
Utilisation de raccourcis clavier pour réduire et développer le code
|
Commande |
Windows |
Macintosh |
|
Réduire la sélection |
Ctrl+Maj+C |
Commande+Maj+C |
|
Réduire à l'extérieur de la sélection |
Ctrl+Alt+C |
Commande+Alt+C |
|
Développer la sélection |
Ctrl+Maj+E |
Commande+Maj+E |
|
Réduire balises entières |
Ctrl+Maj+J |
Commande+Maj+J |
|
Réduire extérieur balises entières |
Ctrl+Alt+J |
Commande+Alt+J |
|
Tout développer |
Ctrl+Alt+E |
Commande+Alt+E |
Copier-coller d’un fragment de code réduit
Cliquez sur le fragment de code réduit pour le sélectionner.
Sélectionnez Edition > Copier.
Placez le curseur à l’endroit où vous voulez coller le code.
Sélectionnez Edition > Coller.
Créez de magnifiques sites web dans Dreamweaver
Concevez, codez et gérez des sites web dynamiques dans un puissant outil tout-en-un.
