Modification de code en mode Création.

Dreamweaver permet de créer et de modifier visuellement des pages web sans se soucier du code source sous-jacent. Toutefois, vous serez peut-être amené à modifier ce code afin d’avoir le plein contrôle des opérations effectuées sur vos pages ou de corriger les éventuels problèmes. Dreamweaver vous permet de modifier une partie du code en mode Création.

Cette section est destinée aux personnes qui préfèrent travailler en mode Création, mais qui souhaitent également disposer d’un accès rapide au code.

En mode Création, si vous sélectionnez un objet contenant des balises enfants, par exemple un tableau HTML, vous pouvez sélectionner rapidement la première balise enfant de cet objet en choisissant Édition > Sélectionner enfant.

Par exemple, la balise <table> comporte normalement des balises enfants <tr>. Si vous sélectionnez une balise <table> dans le sélecteur de balises, vous pouvez sélectionner la première ligne du tableau en choisissant Édition> Sélectionner enfant. Dreamweaver sélectionne la première balise <tr> dans le sélecteur de balises. Etant donné que la balise <tr> comporte elle-même des balises enfants, <td> (délimiteur de cellule), vous pouvez choisir à nouveau Édition > Sélectionner enfant pour sélectionner la première cellule du tableau.

Modification de code avec l’inspecteur Propriétés

Vous pouvez utiliser l’inspecteur Propriétés pour examiner et modifier les attributs du texte ou des objets dans votre page. Souvent, les propriétés affichées dans l’inspecteur Propriétés correspondent aux attributs des balises ; la modification de l’une de ces propriétés dans l’inspecteur revient en principe à modifier l’attribut correspondant en mode Code.

Modification de code CFML avec l’inspecteur Propriétés

L’inspecteur Propriétés permet d’examiner et de modifier le code CFML (ColdFusion markup language) en mode Création.

Présentation de Quick Tag Editor

Vous pouvez utiliser Quick Tag Editor pour examiner, insérer et modifier rapidement des balises HTML sans quitter le mode Création.

Si vous tapez des éléments de code HTML non valides dans Quick Tag Editor, Dreamweaver tentera de les corriger en insérant au besoin des guillemets ou des crochets de fermeture.

Pour définir les options de Quick Tag Editor, ouvrez-le en appuyant sur Ctrl+T (Windows) ou sur Cmd+T (Macintosh).

Quick Tag Editor comporte trois modes :

• Insérer HTML, qui permet d’insérer de nouveaux éléments de code HTML ;
• Modifier la balise, qui permet de modifier une balise existante ;

• Insérer HTML, qui permet d’insérer de nouveaux éléments de code HTML ;

• Modifier la balise, qui permet de modifier une balise existante ;

• Envelopper avec balise, qui permet d'insérer une nouvelle balise de part et d'autre d'une sélection.

Dans les trois modes, le fonctionnement de base de Quick Tag Editor reste le même : ouvrez l’éditeur, saisissez ou modifiez des balises et des attributs, puis fermez l’éditeur.

Lorsque Quick Tag Editor est actif, vous pouvez passer d’un mode à l’autre en appuyant sur Ctrl+T (Windows) ou Cmd+T (Macintosh).  

Modification de code avec Quick Tag Editor

Utilisez Quick Tag Editor ( Modifier > Quick Tag Editor) pour insérer et modifier rapidement des balises HTML sans quitter le mode Création.

Insertion d’une balise HTML

Modification d’une balise HTML

Insertion de balises HTML de part et d’autre d’une sélection

Utilisation des menus d’indication dans Quick Tag Editor

Dans Quick Tag Editor, vous pouvez accéder à un menu contextuel d’attributs répertoriant tous les attributs valides de la balise que vous modifiez ou insérez.

Vous pouvez également désactiver le menu contextuel ou modifier le délai s’écoulant avant l’apparition du menu déroulant dans Quick Tag Editor.

Pour afficher un menu contextuel répertoriant les attributs de balise valides, arrêtez-vous quelques secondes pendant la modification d’un nom d’attribut dans Quick Tag Editor. Un menu contextuel apparaît, répertoriant tous les attributs valides de la balise que vous modifiez.

De même, arrêtez-vous quelques secondes pendant la saisie ou la modification d'un nom de balise dans Quick Tag Editor pour afficher le menu contextuel correspondant aux balises.

Désactivation du menu contextuel ou modification du délai s’écoulant avant l’apparition du menu contextuel

Modification de code à l’aide du sélecteur de balises

Vous pouvez utiliser le sélecteur de balises pour sélectionner, modifier ou supprimer les balises sans quitter le mode Création. Le sélecteur de balises se trouve dans la barre d'état en bas de la fenêtre de document, et présente une série de balises.

Modification ou suppression d’une balise

Sélection d’un objet correspondant à une balise

Rédaction et modification de scripts en mode Création

Vous pouvez travailler avec des scripts JavaScript et VBScript côté client en modes Création et Code, en procédant des manières suivantes :

• Vous pouvez écrire un script JavaScript ou VBScript pour votre page sans quitter le mode Création.

• Vous pouvez créer un lien dans votre document vers un fichier script externe sans quitter le mode Création.

• Vous pouvez modifier un script sans quitter le mode Création.

  Avant toute chose, assurez-vous que l’affichage des marqueurs de script sur la page est activé en sélectionnant Affichage > Assistances visuelles > Eléments invisibles.

Rédaction d’un script côté client

La balise de script pour le fichier sélectionné est insérée dans le document.

Modification d’un script

Modification de scripts ASP côté serveur en mode Création

L’inspecteur Propriétés de script ASP permet d’examiner et de modifier les scripts ASP côté serveur en mode Création.

Modification de scripts sur la page à l’aide de l’inspecteur Propriétés

Utilisation de comportements JavaScript

L’onglet Comportements de l’inspecteur de balises permet d’associer aisément des comportements JavaScript (côté client) aux éléments d’une page. Pour plus d’informations, voir Application de comportements JavaScript Dreamweaver intégrés.