請使用本主題,了解如何在 Dreamweaver 中建立圖庫項目,以及在文件中插入和編輯圖庫項目。

「圖庫」是一種特殊的 Dreamweaver 檔案,其中包含個別資源的集合,或是您可以放在網頁中的資源複本。圖庫中的資源就稱為「圖庫項目」。您可以儲存在圖庫中的項目,包括影像、表格、聲音和使用 Adobe Flash 建立的檔案。每當您編輯圖庫項目時,就會自動更新使用這個項目的所有頁面。

例如,假設您正在為某間公司建立一個大型網站,而此公司希望在每一頁上都出現一段相同的標語。您可以建立一個包含此標語的圖庫項目,並在每一頁上使用此圖庫項目。如果此標語變更,您就可以變更此圖庫項目,並自動更新使用此項目的每一頁。

Dreamweaver 會針對每個網站,將其圖庫項目儲存在本機根資料夾的 Library 資料夾中。每一個網站都有其本身的圖庫。

您可以將文件的 body 區段中任何元素,建立成為圖庫項目,包括文字、表格、表單、Java Applet、外掛程式、ActiveX 元素、導覽列及影像。

對於連結的項目 (例如影像),圖庫只是儲存這個項目的參考。原始檔案必須保持在特定的位置,圖庫項目才能正確地運作。

即使如此,在圖庫項目中儲存影像還是相當有用。例如,您可以在圖庫項目中儲存完整的 在圖庫項目中儲存完整的 img 標籤,以便輕易地變更整個網站上影像的 alt 文字,甚至是影像的 src 屬性 (不過,請不要用這種技巧變更影像的 widthheight 屬性,除非您同時使用影像編輯器來變更影像的實際大小)。

註解:

如果圖庫項目含有連結,這些連結不一定能在新的網站中運作。同時,圖庫項目中的影像也不會複製到新網站。

當您使用圖庫項目時,Dreamweaver 會在網頁中插入其連結,而非插入項目本身。也就是說,Dreamweaver 會將這個項目的 HTML 原始碼複本插入文件中,並加上 HTML 註解,其中包含原始外部項目的參考。這個外部參考可以讓自動更新作業順利進行。

當您建立的圖庫項目包含附加了 Dreamweaver 行為的元素時,Dreamweaver 便會將此元素和其事件處理常式 (此屬性會指定哪個事件會觸發 onClickonLoadonMouseOver 等動作,以及事件發生時要呼叫哪個動作) 複製到圖庫項目檔案。Dreamweaver 不會將關聯的 JavaScript 函式複製到圖庫項目中。相反的,當您將圖庫項目插入文件時,Dreamweaver 會自動將適當的 JavaScript 函式插入該文件的 head 區段中 (如果此處沒有這些函式的話)。

註解:

如果是以手工撰寫 JavaScript (就是不使用 Dreamweaver 行為來建立) 的話,便可以在使用「呼叫 JavaScript」行為執行程式碼時,使其成為圖庫項目的一部分。如果您不使用 Dreamweaver 行為來執行程式碼,就不會將程式碼保留為圖庫項目的一部分。

在圖庫項目中編輯這些行為時,有一些特殊要求。圖庫項目不能含有樣式表,因為這些元素的程式碼是 head 區段的一部分。

根據選取範圍建立圖庫項目

  1. 在「文件」視窗中,切換至「設計」檢視並選取文件中要另存成圖庫項目的部分。

  2. 選取「工具 > 圖庫 > 將物件加入圖庫」。

  3. 輸入新圖庫項目的名稱,再按 Enter 鍵 (Windows) 或 Return 鍵 (Macintosh)。

    Dreamweaver 會在網站本機根資料夾的 Library 資料夾中,將每個圖庫項目儲存成個別的檔案 (副檔名為 .lbi)。

建立空的圖庫項目

  1. 請確定在「文件」視窗中沒有選取任何東西。

    如果選取了任何東西,它就會被放到新圖庫項目中。

  2. 在「資源」面板中,選取「圖庫」類別。

  3. 按一下面板底部的「新增圖庫項目」按鈕。

  4. 在選取該項目的同時,請輸入其名稱,然後再按 Enter 鍵 (Windows) 或 Return 鍵 (Macintosh)。

將圖庫項目插入文件

當您將圖庫項目加入頁面時,實際內容會與圖庫項目的參考一起插入到文件中。

  1. 請將插入點放在「文件」視窗中。
  2. 在「資源」面板中,選取「圖庫」類別。

  3. 請執行下列其中一項作業:
    • 將圖庫項目從「資源」面板拖曳到「文件」視窗中。

    註解:

    若要在文件中插入圖庫項目的內容,但是不包含項目的參考,請按 Control (Windows) 或 Option (Macintosh) 並同時將項目拖曳到「資源」面板的「圖庫」類別之外。如果以這種方式插入項目,就可以在文件中編輯此項目,但是當您更新使用該圖庫項目的頁面時,並不會同時更新文件。

    • 選取圖庫項目,並按一下「插入」。

編輯圖庫項目和更新文件

在編輯圖庫項目時,也會同時更新所有使用這個項目的文件。如果選擇不要更新,文件仍會保持與圖庫項目相關聯;您可以稍後再更新它們。

您可以重新命名項目以中斷項目與文件或範本的連線、從網站的圖庫中刪除項目,以及重新建立遺失的圖庫項目。

編輯圖庫項目

  1. 在「資源」面板中,選取「圖庫」類別。

  2. 選取圖庫項目。
  3. 按一下「編輯」按鈕,或按兩下圖庫項目。

    Dreamweaver 會開啟一個與「文件」視窗類似的新視窗,讓您編輯圖庫項目。灰色的背景表示您正在編輯的是圖庫項目,而不是文件。

  4. 進行變更,然後加以儲存。
  5. 指定是否在使用該圖庫項目的本機網站上更新文件。選取「更新」以立即進行更新。如果選取「不要更新」,則文件會等到您選擇「工具 > 圖庫 > 更新目前頁面 (或更新頁面)」後,才進行更新。

更新目前的文件以使用所有圖庫項目的最新版本

  1. 選取「工具 > 圖庫 > 更新目前頁面」。

更新整個網站或使用特定圖庫項目的所有文件

  1. 選取「工具 > 圖庫 > 更新頁面」。

  2. 在「查詢」彈出式選單中,指定要更新的項目:
    • 若要更新所選取網站中的所有頁面,以使用所有圖庫項目的最新版本,請選取「整個網站」,然後從旁邊的彈出式選單中選取網站名稱。

    • 若要更新目前網站中使用該圖庫項目的所有頁面,請選取「使用的檔案」,然後從旁邊的彈出式選單中選取圖庫項目名稱。

  3. 請確定已在「更新」選項中選取「圖庫項目」。

    註解:

    若要同時更新範本,請也選取「範本」。

  4. 按一下「開始」。

    Dreamweaver 會按照指示更新檔案。如果選取「顯示記錄」選項,Dreamweaver 會產生一個報表,顯示檔案是否已順利更新,並顯示其他資訊。

重新命名圖庫項目

  1. 在「資源」面板中,選取「圖庫」類別。

  2. 選取圖庫項目,暫停一下,然後再按一下該圖庫項目 (請勿按兩下;按兩下會開啟該項目以進行編輯)。
  3. 最後輸入新的名稱。
  4. 在別的地方按一下,或是按 Enter 鍵 (Windows) 或 Return 鍵 (Macintosh)。
  5. 指定是否選擇「更新」以更新使用該項目的文件,或者選擇「不要更新」不更新該文件。

從圖庫中刪除圖庫項目

當您刪除圖庫項目時,Dreamweaver 會從圖庫中移除該項目,但是不會變更任何使用此項目的文件內容。

  1. 在「資源」面板中,選取「圖庫」類別。

  2. 選取圖庫項目。
  3. 按一下「刪除」按鈕或按 Delete 鍵,然後確認是否要刪除該項目。

    註解:

    如果刪除圖庫項目,就無法使用「還原」進行復原。不過,您還是可以重新建立該項目。

重新建立遺失或已刪除的圖庫項目

  1. 請在您的任何文件中選取這個項目的實體。
  2. 按一下「屬性」檢視窗 (「視窗 > 屬性」) 中的「重新建立」按鈕。

自訂圖庫項目的標示

您可以設定「標示」偏好設定,以自訂圖庫項目的標示顏色,並顯示或隱藏標示。

變更圖庫項目的標示顏色

  1. 選取「編輯 > 偏好設定」(Windows) 或「Dreamweaver > 偏好設定」(Macintosh)。
  2. 從「偏好設定」對話方塊左側的清單中,選取「標示」類別。
  3. 按一下「圖庫項目」顏色方塊,然後使用檢色器選取標示顏色 (或在文字方塊中輸入十六進位顏色值)。
  4. 選取「顯示」,在「文件」視窗中顯示標示顏色。
  5. 按一下「確定」。

若要顯示或隱藏文件視窗中的標示

  1. 若要顯示標示,請選取「檢視 > 設計檢視選項 > 視覺輔助 > 隱藏元素」。若要隱藏標示,請取消選取「隱藏元素」。

編輯圖庫項目的屬性

您可以使用「屬性」檢視窗,開啟圖庫項目以進行編輯、將選取的圖庫項目從原始檔中分離,或是以目前選取的圖庫項目覆寫某個項目。

  1. 選取文件中的圖庫項目。
  2. 選取屬性檢視窗 (「視窗 > 屬性」) 中的其中一個選項:

    原始檔

    顯示圖庫項目原始檔的檔名和位置。您無法編輯這項資訊。

    開啟

    開啟圖庫項目的原始檔以進行編輯。這相當於在「資源」面板中選取項目後,按一下「編輯」按鈕。

    從原始檔中分離

    中斷所選取的圖庫項目與其原始檔的連結。您可以在文件中編輯所分離的項目,但是它不再是圖庫項目,而且在您變更原始項目時也不會隨之更新。

    重新建立

    使用目前的選取範圍來覆寫原始的圖庫項目。如果原始圖庫項目遺失或不小心被刪除時,請使用這個選項以重新建立圖庫項目。

使圖庫項目在文件中成為可編輯狀態

如果將圖庫項目加入文件後,想要只編輯這個頁面的該項目時,您必須先中斷文件中此項目與圖庫之間的連結。當圖庫項目的實體變成可編輯狀態後,這個實體就不會再隨著圖庫項目的變更而更新。

  1. 請在目前文件中選取圖庫項目。
  2. 在「屬性」檢視窗 (「視窗 > 屬性」) 中,按一下「從原始檔中分離」。

編輯圖庫項目中的行為

若要編輯圖庫項目中的行為,您必須先將此項目插入文件中,然後使該項目在文件中變成可編輯狀態。在完成所要的變更後,您便可以重新建立圖庫項目,以文件中已編輯的項目來取代圖庫中的項目。

  1. 開啟含有圖庫項目的文件。

    請記下圖庫項目的名稱,以及它包含的確切標籤。您稍後會需要這項資訊。

  2. 選取圖庫項目,然後按一下「屬性」檢視窗 (「視窗 > 屬性」) 中的「從原始檔中分離」。
  3. 選取附加了行為的元素。
  4. 在「行為」面板 (「視窗>行為」) 中,按兩下所要變更的動作。
  5. 在顯示的對話方塊中,進行所要的變更,然後按一下「確定」。
  6. 在「資源」面板中,選取「圖庫」類別。

  7. 記錄原始圖庫項目的確實名稱和大小寫;選取它,然後按一下「刪除」按鈕。
  8. 在「文件」視窗中,選取構成該圖庫項目的所有元素。

    請務必選取和原始圖庫項目中完全相同的元素。

  9. 在「資源」面板中,按一下「新增圖庫項目」按鈕,然後使用相同的拼字和大小寫,為新項目指定與您所刪除項目相同的名稱。

  10. 若要更新網站其他文件中的圖庫項目,請選取「工具 > 圖庫 > 更新頁面」。

  11. 在「查詢」彈出式選單中,選取「使用的檔案」。
  12. 在旁邊的彈出式選單中,選取剛建立的圖庫項目名稱。
  13. 請確定在「更新」選項中選取了「圖庫項目」,然後按一下「開始」。
  14. 當更新完成時,請按一下「關閉」。

此産品由 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License 授權  Creative Commons 條款未涵蓋 Twitter™ 與 Facebook 文章。

法律說明   |   線上隱私權政策