- 相關推薦
如何使用dreamweaver的模板功能
通常在一個網站中會有幾十甚至幾百個風格基本相似的頁面，如果每次都重新設定網頁結構以及相同欄目下的導航條、各類圖標就顯得非常麻煩，不過我們可以借助Dreamweaver MX 2004的模板功能來簡化操作。其實模板的功能就是把網頁布局和內容分離，在布局設計好之后將其存儲為模板，這樣相同布局的頁面可以通過模板創建，因此能夠極大提高工作效率。
下面是個較全面的例子，能迅速的讓你掌握模板的使用。
1. 編輯頁面
打開DW，新建一個站點，我們就取名為“蜘蛛網”。
新建一個空白頁面作為內頁(通常一個網站只有一個首頁，所以對首頁我們可以不做成模板)，取名為body.htm。
編輯這個頁面，完成如圖1。
圖1，編輯完成后的body.htm頁面，注意A處，此處將作為可編輯區域，下文會針對提及。
2. 生成模板
編輯完成后，我們將此頁保存為模板(注意不是保存為普通的htm網頁)。通過DW中的FileàSave As Template可以存為模板，執行此命令后會彈出Save As Template窗口，如圖2。
圖2，Save As Template窗口。
圖2中的B處為選擇站點，我們選擇“ 蜘蛛網”，C處為我們要存為的模板文件名，我們填入body。按右上角的Save保存。
這時我們按F8調出site(站點管理器)，在Templates文件夾中可以看到body.dwt(當有模板文件時，DW會自動生成Templates文件夾，dwt為模板類型文件)
3. 編輯模板
在Site中打開body.dwt模板文件，將會發現跟body.htm頁面好像沒什么分別，但其實是不一樣的，在body.htm中是無法添加可編輯區域的。可編輯區域只能在模板文件中添加。
為了讓大家更好的理解“可編輯區域”，我們先用此模板生成一個htm文件：點FileàNew From Template，彈出Select Template窗口，在emplates中選擇body，再點擊右上角的Select即可生成一個新的htm文件。我們將此新建頁面改名為body2.htm。現在我們用DW將body.htm與body2.htm兩文件都打開，比較一下有什么不同。你會發現在body2.htm頁面的右上角寫著“Template:body”幾個字。(說明此頁是由body.dwt模板文件生成)同時你會驚訝的發現body2.htm文件竟然不可以編輯(body.htm可以編輯)。對了，這就是由于在body.dwt模板文件中沒有定義“可編輯區域”的結果，使得生成的頁面都不可編輯了。所以我們必須在模板文件中添加可編輯區域。下面是添加可編輯區域的步驟：
1) 打開body.dwt模板文件，我們希望中間的表格可以編輯(也就是圖1中的A處)。但是要在body.dwt文件中，而不是body.htm)，所以要在此處添加可編輯區域。
2) 將鼠標光標放入A處表格里，點擊鼠標右鍵，選擇New Editable Region…， 彈出New Editable Region窗口，要求填入此可編輯區域的名稱(我們通常稱為可編輯區域標記)。我們填入Region01，點擊ok關閉此窗口完成當前可編輯區域標記的編輯。此時可以看到在表格中有如圖3的顯示。
圖3，New Editable Region窗口。
說明此處有一個標記為Region01的可編輯區域。
到此為止我們定義了一個可編輯區域，如果有多個編輯區域，同樣可以如法炮制。
※還可以通過ModifyàTemplatesàNew Editable Region…生成新的可編輯區域，如果想刪除可編輯區域，可通過ModifyàTemplatesàRemove Editable Region…，然后按提示操作即可。
4. 用模板生成頁面
其實我們前面也提及過用模板生成頁面的步驟，就是通過FileàNew From Template。請參考第三步的有關步驟。現在我們用模板生成一個名為body3.htm的頁面。這時你會發現，在body3.htm頁面中除了可編輯區域Region01可以編輯外，別的地方鼠標都成了限制狀態。我們在此可編輯區域中添加我們需要的內容，比如我們隨便寫入一篇文章。這樣就可以根據我們的需要，利用模板生成頁面。
5. 修改模板內容與更新站點文件
打開body.dwt模板文件，將我們需要修改的地方進行修改，比如我們把logo圖片換掉或修改任何非可編輯區域，甚至添加或刪除可編輯區域等。
下面就用換logo來說明模板是如何更新文件的。
我們把logo圖片換成另外我們喜歡的圖片，完成后保存body.dwt文件，這時DW會彈出窗口詢問是否需要更新文件，選擇Update，DW就會自動的將所有用此模板生成的頁面都更新，更新時DW會彈出Update Pages窗口，完成后，在Update Pages窗口中會給出更新日志。
※如果選擇了don’t Update，DW直接保持模板文件，暫時不更新頁面，但我們可以手動更新頁面，只要選擇ModifyàTemplatesàUpdate Pages…即可。
這時我們打開任意一個用body.dwt生成的頁面，如body3.htm。會發現logo圖片已經改變。
不難發現，利用這個功能，我們可以輕松的解決站點更新問題，模板的功能十分強大，此文只起到拋磚引玉的作用，很多功能由于篇幅問題未能提及，自己要多嘗試，這樣才能充分領略DW的模板風采。
【如何使用dreamweaver的功能】相關文章：
如何學習使用Dreamweaver06-14
Dreamweaver如何使用空鏈接09-01
在Dreamweaver中如何使用模板08-27
Dreamweaver如何使用錨記鏈接08-05
如何使用Dreamweaver創建站點05-30
如何使用Dreamweaver錨記鏈接10-01
如何使用Dreamweaver設計網頁06-24
Dreamweaver的使用優點05-16
Dreamweaver使用教程09-20