Dreamweaver MX 2004 - RÉCIT de la Commission scolaire de Saint

Transcription

Dreamweaver MX 2004 - RÉCIT de la Commission scolaire de Saint
Dreamweaver MX 2004
Fonctions avancées
Macintosh et Windows
•
•
•
•
•
Liens CSS
Panneau Actifs
Boutons Flash
Texte Flash
Modèles
•
•
•
•
Feuilles de styles CSS
Jeux de cadres
Synchronisation
Voilage
Suzanne Harvey
Conseillère pédagogique
Service local du RÉCIT
Commission scolaire de Saint-Hyacinthe
[email protected]
Décembre 2004
http://recit.cssh.qc.ca
Dreamweaver MX 2004
Fonctions avancées
Table des matières
______________________________________________
page
1. Un peu de vocabulaire ..............................................................................2
2. Style de soulignement des liens CSS ......................................................... 4
3. Panneau Actifs ........................................................................................ 5
4. Boutons Flash ......................................................................................... 6
5. Texte Flash ............................................................................................ 7
6. Modèles ................................................................................................. 8
6.1 Création d'un modèle........................................................... 8
6.2 Création d'une nouvelle page à partir d'un modèle ............... 11
6.3 Application d'un modèle à un document existant .................. 12
6.4 Mise à jour des modèles .....................................................1 3
7. Feuilles de style CSS ..............................................................................1 4
8. Jeux de cadres ......................................................................................1 6
9. Synchronisation du site avec le serveur distant .......................................... 2 0
10.Voilage ................................................................................................2 2
Dreamweaver MX 2004•Fonctions avancées
1
RÉCIT de la CSSH•Suzanne Harvey
Ce document s'adresse aux concepteurs de sites Web qui connaissent déjà bien
Dreamweaver mais qui veulent en savoir plus sur la création de pages dynamiques.
1. Un peu de vocabulaire... tout de même!
Sous Macintosh, Dreamweaver propose une présentation flottante, où chaque document se
trouve dans une fenêtre distincte. Les groupes de panneaux sont initialement ancrés
ensemble, mais vous pouvez les séparer pour les faire apparaître dans leur propre fenêtre.
Les fenêtres s'alignent automatiquement les unes sur les autres sur les côtés de l'écran, et
sur la fenêtre du document au fur et à mesure que vous les faites glisser ou que vous les
redimensionnez.
Dreamweaver MX 2004•Fonctions avancées
2
RÉCIT de la CSSH•Suzanne Harvey
Sous Windows, Dreamweaver propose une présentation intégrée en une seule fenêtre. Dans
l'espace de travail intégré, toutes les fenêtres et tous les panneaux sont rassemblés dans
une grande fenêtre d'application.
Dreamweaver MX 2004•Fonctions avancées
3
RÉCIT de la CSSH•Suzanne Harvey
2. Style de soulignement des liens CSS
Si vous utilisez la boîte de dialogue de propriétés de page CSS par défaut, vous pouvez
facilement modifier le style des liens CSS. A l'aide des options de liens CSS, vous pouvez
décider que les liens ne soient jamais soulignés ou alors qu'ils soient soulignés ou désactivés
uniquement lorsque la souris est placée dessus.
Pour définir un style de lien CSS :
1. Choisissez Modifier > Propriétés de la page ou sélectionnez le bouton Propriétés de la
page dans le panneau Propriétés.
2.
Sélectionnez la catégorie Liens dans la boîte de dialogue Propriétés de la page CSS.
3. Dans le menu déroulant Style souligné, sélectionnez le style souligné à utiliser par défaut
pour votre page.
4. Cliquez sur OK.
Dreamweaver MX 2004•Fonctions avancées
4
RÉCIT de la CSSH•Suzanne Harvey
3. Panneau Actifs
Le terme actif désigne un certain nombre d'éléments utilisés dans un site, tels qu'un fichier
d'image ou d'animation. Vous pouvez afficher et gérer les actifs dans le site actuel à l'aide du
panneau Actifs. Ce dernier présente les actifs du site associés au document actif dans la
fenêtre du document.
Pour ouvrir le panneau Actifs, choisissez Fenêtre > Actifs. Le panneau Actifs s'affiche. La
catégorie Images est sélectionnée par défaut.
Deux vues sont disponibles pour le panneau Actifs :
La liste Site présente tous les actifs de votre site, y compris les couleurs et adresses URL
utilisées dans les documents de votre site.
La liste Favoris affiche uniquement les actifs explicitement sélectionnés.
Dans ces deux listes, les actifs sont répartis en catégories (sur le côté gauche du panneau
Actifs). Les listes Site et Favoris sont toutes deux disponibles pour toutes les catégories
d'actifs à l'exception des modèles et éléments de bibliothèque.
Vous pouvez insérer des images ou des animations dans vos pages à partir du panneau
Actifs.
Images
Fenêtre de
visualisation
Couleurs
URL
Flash
Shockwave
Films
Scripts
Liste des actifs
Modèles
Bibliothèque
Insérer dans la page
Ajouter aux favoris
Modifier
Actualiser la liste
Dreamweaver MX 2004•Fonctions avancées
5
RÉCIT de la CSSH•Suzanne Harvey
4. Boutons Flash
Remarque : Vous devez enregistrer le document avant d'insérer un objet de bouton ou de
texte Flash.
Pour insérer un objet de bouton Flash :
1. Dans la fenêtre de document, placez le point d'insertion à l'endroit où vous voulez insérer
le bouton Flash.
2. Pour ouvrir la boîte de dialogue Insertion d'objets Flash, dans la catégorie Commun de la
barre Insérer, choisissez Support et cliquez sur l'icône Bouton Flash.
La boîte de dialogue Insérer le bouton Flash s'affiche.
3. Renseignez la boîte de dialogue Insérer le bouton Flash, et cliquez sur Appliquer ou OK
pour insérer le bouton Flash dans la fenêtre de document.
Conseil : Pour afficher un aperçu du bouton en mode Création, cliquez sur Appliquer. La boîte
de dialogue reste ouverte et vous pouvez afficher un aperçu du bouton dans votre document.
Dreamweaver MX 2004•Fonctions avancées
6
RÉCIT de la CSSH•Suzanne Harvey
5. Texte Flash
L'objet de texte Flash permet de créer et d'insérer une animation Flash contenant
uniquement du texte. Vous pouvez ainsi créer une petite animation graphique vectorielle
avec les polices et le texte de votre choix.
Pour insérer un objet de texte Flash :
1. Dans la fenêtre de document, placez le point d'insertion là où vous souhaitez insérer le
texte Flash.
2. Pour ouvrir la boîte de dialogue Insérer le texte Flash, dans la catégorie Commun de la
barre Insérer, choisissez Support et cliquez sur l'icône Texte Flash.
La boîte de dialogue Insérer le texte Flash s'affiche.
3. Renseignez la boîte de dialogue Insérer le texte Flash, et cliquez sur Appliquer ou OK
pour insérer le texte Flash dans la fenêtre de document.
Si vous cliquez sur le bouton Appliquer, la boîte de dialogue reste ouverte et vous pouvez
prévisualiser le texte dans le document.
Dreamweaver MX 2004•Fonctions avancées
7
RÉCIT de la CSSH•Suzanne Harvey
6. Modèles
6.1 Création d'un modèle
Un modèle Macromedia Dreamweaver MX 2004 est un type spécial de document qui sert à
concevoir une mise en page « fixe ». Il est alors possible de créer des documents basés sur
le modèle, qui en héritent la mise en page. Lors de la conception d'un modèle, vous spécifiez
les zones des documents basés sur ce modèle que les utilisateurs pourront modifier.
L'un des principaux avantages du modèle est qu'il donne la possibilité de modifier plusieurs
pages simultanément. Tout document créé à partir d'un modèle reste associé à ce modèle
(sauf si vous décidez de détacher le document ultérieurement). Lorsque vous modifiez un
modèle, la conception de tous les documents créés à partir de ce modèle est immédiatement
mise à jour.
Dans le cas d'un document créé à partir d'un modèle, seules les régions modifiables peuvent
subir des modifications ; les régions verrouillées ne peuvent pas être modifiées.
Vous pouvez créer un modèle à partir d'un document existant ou bien à partir d'un nouveau
document vierge.
Pour créer un nouveau modèle, faites Fichier > Nouveau...
Une fenêtre de création d'un nouveau document s'affichera.
Modèle HTML puis cliquez sur Créer.
Choisissez Page de base >
Pour transformer un document existant en modèle, ouvrez le document puis choisissez
Fichier > Enregistrer comme modèle.
Dreamweaver MX 2004•Fonctions avancées
8
RÉCIT de la CSSH•Suzanne Harvey
La boîte de dialogue Enregistrer comme modèle s'affiche.
3. Sélectionnez le site dans lequel vous souhaitez enregistrer le modèle dans le menu
déroulant Site, puis tapez un nom unique pour le modèle dans la zone de texte Enregistrer
sous.
4. Cliquez sur Enregistrer.
Dreamweaver enregistre le fichier de modèle dans le dossier Templates du site, dans le
dossier racine local du site, avec l'extension .dwt. Si ce dossier n'existe pas, Dreamweaver le
crée automatiquement au moment de l'enregistrement du nouveau modèle.
Le nouveau modèle sera ajouté au panneau Actifs.
Remarque : Ne retirez pas vos modèles du dossier Templates et placez dans celui-ci
uniquement des fichiers de modèles. Ne retirez pas non plus le dossier Templates de votre
dossier racine local. Car cela pourrait provoquer des erreurs dans les chemins d'accès des
modèles.
Tout ce que vous ajouterez à une page modèle s'appliquera aux pages créées à partir de ce
modèle. Les utilisateurs de ces pages ne pourront modifier que le contenu s'appliquant aux
régions modifiables que vous y insèrerez.
Pour insérer une région modifiable :
1. Dans la fenêtre de document, procédez de l'une des manières suivantes pour sélectionner
la région.
• Sélectionnez le texte ou le contenu que vous souhaitez définir comme région
modifiable.
• Placez le point d'insertion à l'endroit où vous voulez insérer une région modifiable.
2. Dans la catégorie Commun de la barre Insérer, cliquez sur la flèche du bouton Modèles,
puis choisissez Région modifiable.
Dreamweaver MX 2004•Fonctions avancées
9
RÉCIT de la CSSH•Suzanne Harvey
3. Dans la zone de texte N o m , tapez un nom unique pour la région (vous ne pouvez pas
utiliser le même nom pour plusieurs régions modifiables dans un modèle donné).
Remarque : Ne tapez pas de caractères spéciaux dans la zone de texte Nom.
4. Cliquez sur OK.
La région modifiable est entourée d'un cadre rectangulaire dans le modèle, de la couleur de
surbrillance définie dans les préférences. Dans le coin supérieur gauche de la région, un
onglet indique le nom de la région. Si vous insérez une région modifiable vide dans le
document, son nom s'affiche également dans le cadre qui la délimite.
Pour créer un modèle à l'aide du panneau Actifs
1. Dans le panneau Actifs (Fenêtre > Actifs), sélectionnez la catégorie Modèles
sur le
côté gauche du panneau.
La catégorie Modèles du panneau Actifs s'affiche.
2. Cliquez sur le bouton Nouveau modèle
en bas du panneau Actifs.
Un nouveau modèle, sans nom, est ajouté à la liste de modèles du panneau Actifs.
3. Le modèle étant toujours sélectionné, donnez-lui un nom, puis appuyez sur Entrée
(Windows) ou Retour (Macintosh).
Dreamweaver crée un nouveau modèle vierge dans le panneau Actifs et dans le dossier
Modèles.
Dreamweaver MX 2004•Fonctions avancées
10
RÉCIT de la CSSH•Suzanne Harvey
6.2 Création d'une nouvelle page à partir d'un modèle
Pour créer une nouvelle page à partir d'un modèle, dans le panneau Actifs (Fenêtre > Actifs),
choisissez la catégorie Modèles
sur le côté gauche du panneau.
Sélectionnez le modèle choisi puis enfoncez le clic de droite de la souris ou, pour une souris à
un seul clic, faites CTRL-clic sur le modèle.
Dans le menu contextuel, choisissez Nouveau à partir d'un modèle.
Une page liée au modèle choisi sera créée et vous pourrez ajouter du contenu dans la ou les
régions modifiables.
Dreamweaver MX 2004•Fonctions avancées
11
RÉCIT de la CSSH•Suzanne Harvey
6.3 Application d'un modèle à un document existant
Lorsque vous appliquez un modèle à un document contenant déjà des éléments,
Dreamweaver tente de faire concorder le contenu existant avec une région du modèle. Si le
modèle que vous appliquez au document est une version révisée de l'un des modèles
existants, il est probable que les noms concordent.
Si vous appliquez un modèle à un document auquel aucun modèle n'a encore été appliqué,
les régions modifiables ne peuvent pas être comparées et un cas de non-concordance se
présente. Dreamweaver les localise et vous pouvez alors sélectionner la région ou les régions
vers lesquelles le contenu de la page courante doit être transféré, ou bien décider de
supprimer le contenu non cohérent.
Vous pouvez appliquer un modèle à un document existant à l'aide du panneau Actifs ou à
partir de la fenêtre de document. Vous pouvez annuler l'application d'un modèle si
nécessaire.
Pour appliquer un modèle à un document existant à l'aide du panneau Actifs :
1. Ouvrez le document auquel vous souhaitez appliquer le modèle.
2. Dans le panneau Actifs (Fenêtre > Actifs), choisissez la catégorie Modèles
sur le côté
gauche du panneau.
3. Procédez de l'une des manières suivantes :
• Faites glisser le modèle que vous souhaitez appliquer du panneau Actifs dans la
fenêtre de document.
• Sélectionnez le modèle que vous souhaitez appliquer, puis cliquez sur le bouton
Appliquer en bas du panneau Actifs.
Si le document comporte des éléments qui ne peuvent pas être automatiquement attribués à
une région de modèle, la boîte de dialogue Noms de région incohérents s'affiche.
4. Le cas échéant, sélectionnez une destination pour le contenu non concordant, puis cliquez
sur OK.
Pour appliquer un modèle à un document existant à partir de la fenêtre de document :
1. Ouvrez le document auquel vous souhaitez appliquer le modèle.
2. Choisissez Modifier > Modèles > Appliquer le modèle à la page.
La boîte de dialogue Sélectionner le modèle s'affiche.
3. Sélectionnez un modèle dans la liste, puis cliquez sur le bouton Sélectionner.
Si le document comporte des éléments qui ne peuvent pas être automatiquement attribués à
une région de modèle, la boîte de dialogue Noms de région incohérents s'affiche.
4. Le cas échéant, sélectionnez une destination pour le contenu non concordant, puis cliquez
sur OK.
Dreamweaver MX 2004•Fonctions avancées
12
RÉCIT de la CSSH•Suzanne Harvey
6.4 Mise à jour des modèles
Lorsque vous modifiez un modèle, Dreamweaver vous invite à mettre à jour les documents
basés sur ce modèle :
Vous pouvez manuellement mettre à jour le document en cours ou le site tout entier si
nécessaire. La mise à jour manuelle des documents basés sur le modèle a le même effet
qu'une nouvelle application du modèle.
Pour que les modifications apportées au modèle soient appliquées au document en cours :
1. Ouvrez le document dans la fenêtre de document.
2. Choisissez Modifier > Modèles > Mettre à jour la page en cours.
Dreamweaver applique au document les modifications apportées au modèle.
Pour mettre à jour le site entier ou tous les documents utilisant le modèle spécifié :
1. Choisissez Modifier > Modèles > Mettre à jour les pages.
La boîte de dialogue Mettre à jour les pages s'affiche.
2. Complétez la boîte de dialogue, puis cliquez sur le bouton Démarrer.
Dreamweaver MX 2004•Fonctions avancées
13
RÉCIT de la CSSH•Suzanne Harvey
7. Feuilles de style CSS
Utilisation des feuilles de style en cascade
Par défaut, Dreamweaver utilise des feuilles de style en cascade (CSS) pour mettre le texte
en forme. Les styles appliqués au texte à l'aide de l'inspecteur de propriétés ou des
commandes de menu génèrent des règles CSS intégrées à la section head du document. Les
styles CSS offrent plus de flexibilité et un meilleur contrôle sur l'aspect de votre page :
positionnement précis dans la mise en page, utilisation de polices et de styles de texte
spécifiques, etc.
Vous pouvez créer vos propres styles que vous utiliserez dans vos documents (que vous
pourrez nommer, par exemple, titre, texte, menu...).
Création d'un style CSS
Vous pouvez créer une feuille de style CSS pour automatiser la mise en forme d'une plage de
texte.
Pour créer un nouveau style CSS :
1. Placez le point d'insertion dans le document, puis procédez de l'une des manières
suivantes pour ouvrir la nouvelle boîte de dialogue Nouveau style CSS :
• Dans l'angle inférieur droit du panneau Styles CSS (Fenêtre > Styles CSS), cliquez sur le
bouton Nouveau style CSS (+).
• Dans l'inspecteur de propriétés de texte, choisissez Gérer les styles dans le menu déroulant
Style et cliquez sur le bouton Nouveau dans la boîte de dialogue qui s'affiche.
Dreamweaver MX 2004•Fonctions avancées
14
RÉCIT de la CSSH•Suzanne Harvey
La boîte de dialogue Nouveau style CSS apparaît.
2. Définissez le type de style CSS que vous souhaitez créer :
Pour créer un style personnalisé applicable en tant qu'attribut class à une plage ou un bloc de
texte, choisissez Créer un style personnalisé (classe), puis entrez le nom du style dans la
zone de texte Nom.
Remarque : Les noms de classe doivent commencer par un point et peuvent contenir
n'importe quelle combinaison de lettres et de chiffres (par exemple, .monentête1). Si vous
omettez le point, Dreamweaver l'insère à votre place.
3. Sélectionnez l'emplacement dans lequel définir le style :
Pour créer une feuille de style externe, choisissez Nouveau fichier feuille de style.
Pour incorporer le style dans le document actif, choisissez Seulement ce document.
4. Cliquez sur OK.
La boîte de dialogue Définition du style s'affiche.
5. Choisissez les options du nouveau style CSS.
6. Lorsque vous avez défini les attributs de style, cliquez sur OK.
Les nouveaux styles ainsi créés apparaîtront dans le menu déroulant Style de l'inspecteur de
propriétés de texte.
Dreamweaver MX 2004•Fonctions avancées
15
RÉCIT de la CSSH•Suzanne Harvey
8. Jeux de cadres
La partie d'une fenêtre du navigateur pouvant afficher un document HTML indépendamment
de ce qui apparaît dans le reste de la fenêtre constitue un cadre.
Un jeu de cadres est un fichier HTML qui définit la mise en forme et les propriétés de
plusieurs cadres, dont le nombre, la taille et l'emplacement des cadres, ainsi que l'URL de la
page qui s'affiche initialement dans chaque cadre. Le fichier du jeu de cadres ne contient pas
de contenu HTML qui s'affiche dans un navigateur; il fournit simplement au navigateur des
informations sur la mise en forme d'un jeu de cadres et les documents qu'il doit afficher.
L'exemple suivant présente une mise en forme de cadre contenant trois cadres : un cadre
étroit qui contient la barre de navigation dans la partie latérale, un cadre en haut du
document contenant le logo et le titre d'un site Web et un grand cadre avec le contenu
principal qui occupe le reste de la page. Chacun de ces cadres affiche un document HTML
distinct.
Dans cet exemple, le document affiché dans le cadre supérieur ne change jamais lorsque les
visiteurs consultent le site. La barre de navigation du cadre latéral contient des liens qui,
lorsqu'ils sont activés, modifient le contenu du cadre principal, mais pas le contenu du cadre
latéral. Le cadre de contenu principal à droite affiche le document correspondant à tous les
liens activés par le visiteur dans la partie gauche.
Un cadre n'est pas un fichier. On pourrait croire que le document affiché dans un cadre fait
partie intégrante de ce dernier, mais ce n'est pas le cas. Le cadre contient le document. En
effet, les cadres peuvent afficher n'importe quel document.
Remarque : Le mot page peut désigner un seul document HTML ou l'ensemble du contenu
d'une fenêtre du navigateur à un moment donné, même si plusieurs documents HTML sont
affichés simultanément. Par exemple, l'expression « une page qui utilise des cadres »
s'applique généralement à un jeu de cadres et aux documents qui y figurent.
Tout site affiché dans un navigateur sous forme d'une page unique constituée de trois cadres
contient en fait au moins quatre documents HTML, à savoir le fichier du jeu de cadres et les
trois documents qui incluent le contenu et sont initialement affichés dans les cadres. Lorsque
vous concevez une page à l'aide de jeux de cadres dans Dreamweaver, vous devez
enregistrer chacun de ces quatre fichiers pour que la page s'affiche correctement dans le
navigateur.
Dreamweaver MX 2004•Fonctions avancées
16
RÉCIT de la CSSH•Suzanne Harvey
Choix de l'utilisation des cadres
Les cadres sont le plus souvent utilisés pour la navigation. Un jeu de cadres inclut
généralement un cadre contenant une barre de navigation et un cadre destiné à afficher le
contenu principal.
Cependant, la conception d'un site à l'aide de cadres peut s'avérer fastidieuse. Dans la
plupart des cas, il est possible de créer une page Web sans faire appel à un jeu de cadres.
Par exemple, si vous voulez afficher une barre de navigation à gauche de la page, vous
pouvez remplacer la page par un jeu de cadres ou simplement inclure la barre de navigation
sur chacune des pages du site (Dreamweaver vous permet de créer plusieurs pages dont la
mise en forme est identique ; voir la section 5 sur les modèles). Dans l'illustration suivante,
la mise en forme de la page ressemble à une mise en forme avec cadres, mais elle n'en
contient pas.
L'utilisation des cadres présente les avantages suivants :
• Le navigateur d'un visiteur n'a pas besoin de recharger les graphiques liés à la
navigation à chaque page.
• Chaque cadre possède sa propre barre de défilement (si le contenu ne tient pas
entièrement dans une fenêtre) pour que le visiteur puisse faire défiler les cadres
indépendamment les uns des autres.
Par exemple, un visiteur ayant fait défiler une longue page jusqu'en bas n'est pas
obligé de la faire défiler à nouveau vers le haut pour afficher la barre de navigation si
celle-ci figure dans un autre cadre.
L'utilisation des cadres présente les inconvénients suivants :
• L'alignement graphique des éléments de différents cadres n'est pas toujours précis.
• La navigation peut être longue.
• Comme l'URL de chacune des pages contenues dans les cadres n'est pas affichée dans
le navigateur, les visiteurs risquent de ne pas pouvoir ajouter de signet à une page
donnée (à moins que vous ne fournissiez le code du serveur permettant de charger la
version avec cadres d'une page).
Dreamweaver MX 2004•Fonctions avancées
17
RÉCIT de la CSSH•Suzanne Harvey
Création de cadres et de jeux de cadres
Il y a deux façons de créer un jeu de cadres dans Dreamweaver : vous pouvez sélectionner
un jeu de cadres prédéfini ou le concevoir vous-même.
Si vous choisissez un jeu de cadres prédéfini, tous les jeux de cadres et cadres nécessaires à
la création de la mise en forme sont automatiquement configurés, ce qui représente le
moyen le plus simple d'insérer rapidement une mise en forme avec des cadres dans la page.
Vous pouvez uniquement insérer un jeu de cadres prédéfini dans la fenêtre de document en
mode Création.
Pour créer un jeu de cadres prédéfini et afficher un document existant dans un cadre :
1. Placez le point d'insertion dans le document.
2. Dans la catégorie Mise en forme de la barre Insérer, cliquez sur la flèche du bouton
Cadres, puis choisissez un jeu de cadres prédéfini.
Les icônes de jeu de cadres fournissent une représentation visuelle de chaque jeu de cadres
appliqué au document en cours. La zone bleue de l'icône du jeu de cadres représente le
document courant et la zone blanche les cadres qui afficheront d'autres documents.
Remarque : Lorsque vous appliquez un jeu de cadres, Dreamweaver définit automatiquement
le jeu de cadres de sorte qu'il affiche le document courant (celui dans lequel se trouve le
point d'insertion) dans un des cadres.
3.
Sélectionnez Fenêtre > Cadres afin d'afficher le panneau des attributs des cadres.
Dreamweaver MX 2004•Fonctions avancées
18
RÉCIT de la CSSH•Suzanne Harvey
La fenêtre de dialogue des attributs des cadres s'affichera.
Dans la fenêtre des attributs des cadres, sélectionnez un cadre et nommez-le à l'aide du
panneau Propriétés > Nom du cadre. Renseignez ensuite les autres options du cadre.
Conception d'un jeu de cadres
Vous pouvez concevoir votre propre jeu de cadres en sélectionnant Nouveau... . Une fenêtre
de dialogue Nouveau document s'affichera. Sélectionnez Jeux de cadres et choisissez le
type de jeu qui vous convient.
Complétez le contenu des pages ainsi créées à l'intérieur des cadres. Faites Fichier >
Enregistrer tout. Pour un jeu de deux cadres par exemple, une boîte de dialogue vous
proposera de nommer trois fichiers, soit les deux fichiers liés aux cadres et le jeu de cadres
sans fichier (index.html).
Au moment de l'enregistrement, observez les zones encadrées de
gris. Ces marques vous indiquent le fichier actif à nommer.
Dreamweaver MX 2004•Fonctions avancées
19
RÉCIT de la CSSH•Suzanne Harvey
9. Synchronisation du site avec le serveur distant
Après avoir créé des fichiers sur votre site local et votre site distant, il vous est possible de
synchroniser les fichiers entre les deux sites.
Avant de synchroniser les sites, vous pouvez vérifier les fichiers à placer ou à acquérir sur le
serveur distant. Par ailleurs, une fois la synchronisation effectuée, Dreamweaver vous indique
les fichiers qui ont été mis à jour.
Pour identifier les fichiers qui sont plus récents sur le site local ou le site distant sans
effectuer de synchronisation, procédez de l'une des manières suivantes :
• Dans le panneau Fichiers, cliquez sur le menu Options dans le coin supérieur droit,
puis sélectionnez Edition > Sélectionner locaux plus récents ou Edition > Sélectionner
distants plus récents, dans le menu contextuel.
• Dans le panneau Fichiers, cliquez avec le bouton droit (Windows) ou en maintenant la
touche Ctrl enfoncée (Macintosh), puis choisissez Sélectionner > Sélectionner locaux
plus récents ou Sélectionner > Sélectionner distants plus récents.
Pour synchroniser vos fichiers :
1. Dans le panneau Fichiers (Fenêtre > Fichiers), sélectionnez un site dans le menu
déroulant où s'affiche le site, le serveur ou le disque dur.
2. (Facultatif) Sélectionnez des fichiers ou des dossiers spécifiques.
Si vous souhaitez synchroniser l'ensemble du site, ignorez cette étape.
3. Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl
enfoncée (Macintosh), puis choisissez Synchroniser dans le menu contextuel.
Dreamweaver MX 2004•Fonctions avancées
20
RÉCIT de la CSSH•Suzanne Harvey
La boîte de dialogue Synchroniser les fichiers s'affiche.
4. Complétez les options de la boîte de dialogue.
Dreamweaver synchronise automatiquement les fichiers. Si les fichiers sont déjà synchronisés,
Dreamweaver vous informe qu'il n'est pas nécessaire de procéder à leur synchronisation.
Dreamweaver MX 2004•Fonctions avancées
21
RÉCIT de la CSSH•Suzanne Harvey
10. Voilage
Le voilage vous permet de définir les dossiers et les types de fichiers du site que vous
souhaitez exclure de certaines opérations (acquisition et placement, par exemple).
Activation et désactivation du voilage sur un site
Le voilage est activé par défaut sur un site. Vous pouvez le désactiver définitivement ou
provisoirement afin d'effectuer une opération sur tous les fichiers, y compris les fichiers
voilés. Lorsque vous désactivez le voilage sur un site, cela supprime tous les voiles des
fichiers voilés. Lorsque vous le réactivez, tous les fichiers qui étaient précédemment voilés
retrouvent cet état.
Remarque : Vous pouvez également utiliser l'option Supprimer tous les voiles pour supprimer
le voilage de tous les fichiers, mais cela ne désactive pas le voilage. De plus, cette option ne
vous permet pas de rétablir automatiquement le voilage de tous les dossiers et fichiers qui
étaient auparavant voilés ; il vous faut ensuite redéfinir manuellement le voilage par après.
Pour activer et désactiver le voilage sur un site :
1. Dans le panneau Fichiers (Fenêtre > Fichiers), sélectionnez un site dans le menu
déroulant où s'affiche le site, le serveur ou le disque dur.
2. Sélectionnez un fichier ou un dossier.
3. Cliquez avec le bouton droit (Windows) ou en maintenant la touche Ctrl enfoncée
(Macintosh), puis procédez de l'une des façons suivantes :
• Sélectionnez Activer ou Désactiver le voilage.
• Sélectionnez Paramètres, puis choisissez Voilage dans la liste des catégories située à
gauche de la boîte de dialogue Définition du site, onglet Avancé. Sélectionnez ou
désélectionnez Activer le voilage, puis cliquez sur OK.
Cela active ou désactive le voilage sur le site.
Voilage et suppression du voilage pour les dossiers d'un site
Il est possible de voiler des dossiers spécifiques, mais pas tous les dossiers existants ou un
site entier. Il est toutefois possible de voiler plusieurs dossiers simultanément.
Pour voiler ou supprimer le voile de dossiers spécifiques au sein d'un site :
1. Dans le panneau Fichiers (Fenêtre > Fichiers), sélectionnez un site pour lequel le voilage
est activé dans le menu contextuel où est affiché le site, le serveur ou le disque dur.
2. Sélectionnez les dossiers de votre choix auxquels appliquer un voile ou le supprimer.
3. Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl
enfoncée (Macintosh), puis choisissez Voilage > Voiler ou Voilage > Supprimer le voile dans
le menu contextuel.
Une ligne rouge apparaît ou disparaît sur l'icône du dossier pour indiquer que le dossier est
voilé ou dévoilé.
Dreamweaver MX 2004•Fonctions avancées
22
RÉCIT de la CSSH•Suzanne Harvey
Notes
Dreamweaver MX 2004•Fonctions avancées
23
RÉCIT de la CSSH•Suzanne Harvey