Les modèles Dreamweaver
lorsqu'une page HTML est enregistrée sous la forme d'un modèle, Dreamweaver crée un dossier de modèles au niveau de la racine du dossier racine local et génère un fichier.dwt qui devient la source pour toutes les pages appliquées. Chaque fois qu'une page HTML est appliquée à un modèle, (Fichier > Nouveau, à partir d'un modèle ou Modifier > Modèles > Appliquer le modèle à la page), elle crée un lien relatif à la racine du site au fichier.dwt. La raison pour laquelle ce lien relatif au site lie toujours correctement est que le fichier.dwt est toujours dans le dossier modèles, à niveau de la racine, de la structure de dossiers du site. Si le fichier.dwt est déplacé du dossier Modèles et si ce dossier est déplacé ou renommé, le lien est rompu. Il est important de conserver le fichier.dwt dans le dossier Modèles où Dreamweaver le crée. Pour éviter toute confusion, il est recommandé de NE PAS enregistrer d'autres éléments de votre site (des fichiers ou des documents HTML source de l'image), à l'intérieur du dossier Modèles.
Comment les pages sont-elles liées aux fichiers modèles ?
Lorsqu'un fichier est appliqué à une page existante ou créé nouveau d'après un modèle, le code suivant est inséré dans la source :
<!-- #BeginTemplate « /Templates/templateName.dwt » -->
Pour afficher le code source HTML généré par Dreamweaver, choisissez Fenêtre > HTML.
La route ci-dessus remplace la source HTML normal, qui s'affiche sur une nouvelle page. Au lieu de commencer avec les étiquettes produites par le nouveau fichier, il indique qu'un niveau à l'intérieur du dossier racine local, dans un dossier appelé Modèles, il existe un fichier.dwt contenant toutes les informations qui ne sont pas à l'intérieur des zones modifiables de cette page. Cette route envoie le navigateur pour chercher à l'emplacement correct le fichier qui fournira les propriétés de la page, la mise en page, et les graphiques—tout le contenu qui existe uniquement dans le fichier.dwt. C'est la raison pour laquelle les modifications en dehors des zones modifiables d'une page doivent être apportées directement au fichier.dwt. Lorsque le fichier.dwt lui-même est ouvert et révisé, les pages appliquées au modèle sont associées au fichier dans le même emplacement antérieur. Toutes les pages appliquées au modèle sont tous automatiquement actualisées avec les nouvelles informations.
Relatif au document versus relatif à la racine du site
La route de liaison d'une page HTML à un modèle est la route relative à la racine du site. C'est ce que l'on appelle relatif à la racine du site, car il commence à partir du niveau supérieur de la structure de répertoires (le dossier racine local), puis continue par le dossier suivant en bas (modèles), et finalement, les liens au fichier.dwt. Dreamweaver génère automatiquement une route relative à la racine du site vers les modèles dans le dossier Modèles, car il connaît exactement l'endroit où le modèle est localisé, n'importe quels autres dossiers des fichiers existent dans la structure du site.
Crée un chemin relatif au document spécifique à partir d'un fichier à l'autre. Au lieu de commencer au niveau supérieur (racine du site) de la structure des dossiers de fichiers, il génère une route qui commence dans un fichier, passe par les dossiers (répertoires) nécessaires, et s'arrête à l'emplacement de l'autre fichier. Il est impératif que les deux fichiers soient enregistrés dans le dossier racine local AVANT DE créer un lien relatif au document, de l'un vers l'autre.
Si vous souhaitez prévisualiser des pages dans un navigateur en local, avant de télécharger les fichiers sur un serveur distant, celles-ci doivent être relatives au document. Les deux navigateurs Netscape et Internet Explorer n'ont aucun moyen pour identifier le dossier racine local défini (comme Dreamweaver), alors il peut uniquement suivre une route relative au document qu'il examine actuellement. Comme la plupart des utilisateurs préfèrent afficher leurs pages localement dans un navigateur avant de les télécharger, Dreamweaver prend par défaut la valeur du document chaque fois qu'un fichier est lié ou une image est insérée. Si le fichier n'a pas été enregistré AVANT d'insérer une image ou un lien pointant vers une autre page HTML, Dreamweaver n'a pas de référence pour l'emplacement de la page active, il génère une route qui a cette apparence :
file:///HardDrive/Desktop/content.htm dossier/localRootFolder/sous-dossier/sous-dossier/images
ou
file:///C:/Desktop/localRootFolder/subfolder/subfolder/images/content.htm
Ces routes sont spécifiques à votre poste de travail et elles ne fonctionnent pas lorsque vous transférez des fichiers vers un serveur distant.
Le graphique ci-dessous présente une explication graphique de la différence entre des liens relatifs au document et des liens relatifs à la racine du site. Dans l'exemple ci-dessous, la page bio.htm possède un graphique appelé logo.jpg, inséré dans celle-ci, et utilise des routes d'accès alternatives.
|
Les routes relatives au document dans le modèle
L'insertion d'images et les liens dans le fichier *.dwt directement peut prêter à confusion. Rappellez-vous, lorsque vous travaillez dans le fichier.dwt, que tout lien créé en tant que relatif au document est strictement relatif au fichier.dwt. La route générée est spécifique de cette page HTML ou source d'image du fichier .dwt. Dreamweaver conserve un enregistrement où se trouvent les pages référencées, appliquées au modèle en direct, et il ajuste automatiquement la route au fichier HTML référencé, pour être approprié pour la page en cours. Si vous affichez la source HTML pour.dwt et une page appliquée au modèle, les routes sont différentes, et c'est ainsi qu'il doit se passer. Si Dreamweaver n'ajuste pas automatiquement la route d'accès à l'emplacement spécifique de chaque page, la route relative au document se rompt sur tous les fichiers, à l'exception du fichier.dwt.
Voici un exemple de la manière dont Dreamweaver peut ajuster votre route relatifve au document :
La route d'origine du modèle au graphique : |
../graphics/images/banner.gif |
La route ajustée dans la page appliquée au modèle : |
../../graphics/images/banner.gif |
Dreamweaver n'ajuste pas les routes relatives au site ou absolues (http://) du modèle.jusqu'aux pages appliquées au modèle,car il n'est pas nécessaire de les actualiser.
Routes relatives au document dans les pages appliquées au modèle
L'insertion d'images et des liens à l'intérieur de la zone modifiable de page associée à un modèle fonctionne exactement comme l'insertion des images ou des liens dans une page qui n'est pas attachée à un modèle. Si vous suivez la procédure de choisir la commande Fichier > Nouveau, à partir d'un modèle, puis Fichier > Enregistrer (la sélection d'un emplacement à l'extérieur du dossier racine local) AVANT DE créer tous les liens conduisant à d'autres pages ou images, Dreamweaver est par défaut réglé comme document relatif, dans les boîtes de dialogue Sélectionner page HTML ou boîte de dialogue Sélection de l'image. Tant qu'un menu déroulant « Relatif à» n'est pas manuellement changé pour choisir le site racine, les images et les liens sont disponibles, quand vous visionnez votre travail préalablement dans le navigateur localement.
Les routes relatives à la racine du site dans le modèle
Lorsque vous travaillez dans un fichier de modèle pour créer des liens vers d'autres pages ou pour référencer la source d'images de graphiques, le menu contextuel dans les boîtes de dialogue Sélectionner HTML et Sélectionner source image, vous permettent de choisir entre des liens relatifs au document et des liens relatifs à la racine du site. Comme illustré dans le graphique ci-dessus, la sélection de la racine du site crée une route d'accès du fichier sélectionné vers le fichier sélectionné, indépendamment du fichier.dwt qui est actuellement ouvert dans Dreamweaver. L'utilisation des liens relatifs à la racine du site peut être bénéfique lorsque le contenu dans la structure de répertoires de site est susceptible de se déplacer dans le dossier racine local, car le lien reste sans interruption, même si les fichiers sont décalés de leur position d'origine.
La route d'origine du modèle au graphique : |
/graphics/images/banner.gif |
La route d'accès dans la page appliquée au modèle : |
/graphics/images/banner.gif |
Dreamweaver n'ajuste pas les routes relatives au site ou absolues (http://) du modèle.jusqu'aux pages appliquées au modèle,car il n'est pas nécessaire de les actualiser. L'emplacement du document (s'il s'agit du fichier.dwt ou un fichier HTML associé au modèle) est donc inutile pour une route relative à la racine du site.
Les routes relatves à la racine du site dans les pages appliquées au modèle
L'utilisation des liens relatifs à la racine du site peuvent être utiles si le site complexe implique une équipe de développeurs travaillant ensemble, ou s'il comporte une structure de répertoires de site qui est régulièrement actualisée. Pour créer un lien relatif de site, choisissez Racine du site dans menu déroulant, à côté des mots « Relatif à », situés sur la source de sélection de l'image et les boîtes de dialogue choisies du fichier HTML.
Dans la mesure où la route d'accès est créé à partir du dossier racine local, par un nombre indéterminé de sous-dossiers et enfin termine au niveau de la page ou de l'image à laquelle elle est liée, seuls les développeurs ont la possibilité de déplacer les pages ou les actifs, un ou plusieurs, sous-dossiers dans la structure de répertoires du site sans rompre les liens. Par exemple, dans l'illustration ci-dessus, si le fichier logo.jpg doit être déplacé vers le dossier d'images, situé dans le dossier de fonctions, et si le lien est un lien relatif à la racine du site, le navigateur n'a pas de problèmes pour trouver le graphique. Si la route d'accès est un lien relatif au document, le logo.jpg ainsi que les fichiers bio.htm DOIVENT rester dans la structure de dossiers où ils se trouvent, lorsque la route relative au document est créée. Si vous déplacez l'un ou l'autre fichier après que la route est créé, celle-ci se rompt.
Comme mentionné ci-dessus, uniquement des liens relatifs au document peuvent être prévisualisés localement dans le navigateur. Si vous choisissez d'utiliser des liens relatifs à la racine du site, il existe deux manières de visualiser vos pages dans le navigateur.
La première consiste à télécharger (Placer) les fichiers sur le serveur distant, puis d'utiliser votre navigateur pour accéder à la page, en saisissant la route d'accès absolue dans le champ de l'adresse URL. À l'aide de cette méthode, les pages sont vues comme les autres sur le Web. Pour faire des modifications aux pages, ouvrez la copie locale des fichiers, faites des modifications, sauvez les pages HTML, connectez-vous au ftp server et « Placez » les nouveaux fichiers sur le serveur distant. Les fichiers portant le même nom dans le même dossier remplacent les anciennes versions du fichier sur le serveur distant.
La deuxième manière d'afficher un aperçu des liens relatifs de site dans le navigateur est utiliser un serveur Web personnel. Dans Windows uniquement, cette option peut être définie par l'entrée dans Dreamweaver, à l'aide de la commande, Fichier > Aperçu dans le navigateur > Afficher la liste des navigateurs, et sélectionner Aperçu à l'aide du serveur local. La définition de cette option permet à Dreamweaver la prévisualisation du document, à l'aide d'un serveur Web personnel.
Remarque : Pour Macintosh, un serveur Web personnel est défini au niveau du système. Consultez la documentation du système pour obtenir de l'assistance.