Comment utiliser les modèles dans Dreamweaver

Auteur：Eve Cole Date de mise à jour：2009-05-30 18:50:16

Il existe une fonction très puissante dans l'outil de conception Web Dreamweaver (ci-après dénommé DW, la version la plus élevée actuelle est la 4.02, l'exemple dans cet article est la version 4.0), qui sont les modèles !

Alors, quel est le charme des modèles ? Quelles caractéristiques a-t-il ?

À l'aide de modèles, nous pouvons solidifier les éléments qui apparaissent sur chaque page du site.

En utilisant des modèles pour créer des pages WEB, l'ensemble du site peut avoir un style unifié.

Tant que le modèle est modifié, toutes les pages WEB auxquelles le modèle est appliqué peuvent être modifiées sans qu'il soit nécessaire de modifier manuellement chaque page. Par exemple, lorsque vous devez modifier vos droits d’auteur, devez-vous modifier les droits d’auteur page par page ? Et s'il y avait des milliers de pages ? Je crois que vous serez deux ou trois gros au début. Mais si vous utilisez des modèles, cela ne posera pas de problème.

Vous trouverez ci-dessous un exemple plus complet qui peut vous aider rapidement à maîtriser l'utilisation des modèles.

1. Modifier la page

Ouvrez DW et créez un nouveau site, que nous nommerons "Spider Web".

Créez une nouvelle page vierge en tant que page interne (généralement, un site Web n'a qu'une seule page d'accueil, nous n'avons donc pas besoin de créer un modèle pour la page d'accueil) et nommez-la body.htm.

Modifiez cette page et complétez-la comme indiqué dans la figure 1.

Figure 1, la page body.htm une fois l'édition terminée. Faites attention au point A, qui sera utilisé comme zone modifiable et sera mentionné ci-dessous.
2. Générer un modèle

Une fois l'édition terminée, nous enregistrons cette page en tant que modèle (notez qu'elle n'est pas enregistrée en tant que page Web HTML ordinaire). Vous pouvez l'enregistrer en tant que modèle via FileàSave As Template dans DW. Après avoir exécuté cette commande, la fenêtre Save As Template apparaîtra, comme le montre la figure 2.

Figure 2, fenêtre Enregistrer comme modèle.

Dans la figure 2, B est la sélection du site, nous sélectionnons "Spider Web", C est le nom du fichier modèle sous lequel nous voulons enregistrer, nous remplissons le corps. Appuyez sur Enregistrer dans le coin supérieur droit pour enregistrer.

À ce stade, nous appuyons sur F8 pour appeler le site (gestionnaire du site), et vous pouvez voir body.dwt dans le dossier Modèles (lorsqu'il y a un fichier modèle, DW générera automatiquement le dossier Modèles, et dwt est le type de modèle déposer)

3. Modifier le modèle

Lorsque vous ouvrez le fichier de modèle body.dwt dans Site, vous constaterez qu'il ne semble pas différent de la page body.htm, mais il est en réalité différent. Vous ne pouvez pas ajouter de zones modifiables dans body.htm. Les zones modifiables ne peuvent être ajoutées que dans les fichiers modèles.

Afin de permettre à chacun de mieux comprendre la « zone modifiable », nous utilisons d'abord ce modèle pour générer un fichier html : cliquez sur Fichier à Nouveau à partir du modèle, la fenêtre Sélectionner un modèle apparaît, sélectionnez le corps dans les modèles, puis cliquez sur Sélectionner dans la partie supérieure. coin droit pour générer un nouveau fichier htm. Nous renommerons cette nouvelle page body2.htm. Nous utilisons maintenant DW pour ouvrir les fichiers body.htm et body2.htm et comparer les différences. Vous trouverez les mots « Template:body » écrits dans le coin supérieur droit de la page body2.htm. (Cette page est générée à partir du fichier modèle body.dwt) En même temps, vous serez surpris de constater que le fichier body2.htm ne peut pas être modifié (body.htm peut être modifié). À propos, cela est dû au fait que la « zone modifiable » n'est pas définie dans le fichier modèle body.dwt, ce qui rend les pages générées non modifiables. Nous devons donc ajouter une zone modifiable dans le fichier modèle. Voici les étapes pour ajouter une région modifiable :

1) Ouvrez le fichier modèle body.dwt. Nous espérons que le tableau du milieu pourra être modifié (c'est-à-dire A dans la figure 1). Mais dans le fichier body.dwt, pas body.htm), ajoutez donc la zone modifiable ici.

2) Placez le curseur de la souris dans le tableau en A, cliquez avec le bouton droit de la souris et sélectionnez Nouvelle région modifiable.... La fenêtre Nouvelle région modifiable apparaîtra, vous demandant de renseigner le nom de cette région modifiable (nous avons généralement appelez-le la marque de région modifiable). Nous remplissons Region01 et cliquons sur OK pour fermer cette fenêtre et terminer l'édition de la marque de région modifiable actuelle. À ce stade, vous pouvez voir l'affichage dans le tableau comme le montre la figure 3.

Figure 3, fenêtre Nouvelle région modifiable.

Notez qu'il existe une région modifiable marquée Region01.

Jusqu'à présent, nous avons défini une zone modifiable. S'il existe plusieurs zones d'édition, nous pouvons faire de même.

※Vous pouvez également générer une nouvelle région modifiable via ModifyàTemplatesàNew Editable Region…. Si vous souhaitez supprimer la région modifiable, vous pouvez utiliser ModifyàTemplatesàRemove Editable Region…, puis suivre les invites.
4. Générez des pages à l'aide de modèles

En fait, nous avons déjà mentionné que les étapes pour générer des pages à l'aide de modèles se font via FileàNew From Template. Veuillez vous référer aux étapes pertinentes de la troisième étape. Nous utilisons maintenant le modèle pour générer une page nommée body3.htm. À ce stade, vous constaterez que dans la page body3.htm, à l'exception de la zone modifiable Région01, qui peut être modifiée, la souris est restreinte ailleurs. Nous ajoutons le contenu dont nous avons besoin dans cette zone modifiable, par exemple, nous pouvons rédiger un article à volonté. De cette façon, nous pouvons utiliser des modèles pour générer des pages en fonction de nos besoins.

5. Modifier le contenu du modèle et mettre à jour les fichiers du site

Ouvrez le fichier modèle body.dwt et modifiez les zones que nous devons modifier. Par exemple, nous pouvons remplacer l'image du logo ou modifier toute zone non modifiable, ou même ajouter ou supprimer des zones modifiables, etc.

Ce qui suit utilise la modification du logo pour illustrer comment le modèle met à jour le fichier.

Nous changeons l'image du logo en une autre image que nous aimons et enregistrons le fichier body.dwt une fois terminé, DW affichera une fenêtre demandant si le fichier doit être mis à jour, et DW mettra automatiquement à jour toutes les pages. généré avec ce modèle, DW affichera la fenêtre des pages de mise à jour pendant la mise à jour. Une fois terminée, le journal de mise à jour sera affiché dans la fenêtre des pages de mise à jour.

※Si l'option Ne pas mettre à jour est sélectionnée, DW conservera directement le fichier modèle et ne mettra pas à jour la page temporairement, mais nous pouvons mettre à jour manuellement la page, sélectionnez simplement Modifier, Modèles, Mettre à jour les pages….

À ce stade, nous ouvrons n'importe quelle page générée avec body.dwt, telle que body3.htm. Vous constaterez que l’image du logo a changé.

Il n'est pas difficile de constater qu'en utilisant cette fonction, nous pouvons facilement résoudre le problème de la mise à jour du site. Cet article ne sert que de point de départ. De nombreuses fonctions ne peuvent pas être mentionnées en raison de problèmes d'espace. essayez-en davantage pour pouvoir l'utiliser pleinement. Obtenez un avant-goût du style de modèle de DW.

Dans DW, il existe également une fonction appelée bibliothèque, qui peut être combinée de manière organique avec des modèles, ce qui rendra les modèles plus puissants. Si les lecteurs sont intéressés, je suis prêt à offrir ce cadeau à tout le monde.