請執行下列其中一項作業：
上次更新時間
2021年4月29日
將 Dreamweaver 與 Adobe 線上服務搭配使用，包括 BrowserLab 和 Business Catalyst InContext Editing。
Adobe 線上服務為架設好的網路應用程式，運作方式與傳統桌上型電腦工具類似。線上服務的優點在於其內容永遠保持在最新的狀態，因為它們是架設在網路上，而非安裝在您的電腦中。
Dreamweaver 直接與 Adobe® BrowserLab 和 Adobe® Business Catalyst InContext Editing 互相整合。在下列「說明」章節中，含有如何使用這些服務的說明文章。
此外，Dreamweaver 還整合了 Adobe® CS Live 線上服務 (其中包含 BrowserLab)。如需有關使用 CS Live 的詳細資訊，請參閱使用 Adobe CS Live。
如需有關管理 Adobe 線上服務的詳細資訊，請參閱 Adobe 網站，網址為：www.adobe.com/go/learn_creativeservices_tw。
BrowserLab
Adobe BrowserLab 可讓您在不需要先將本機 Web 內容發佈至可公開存取伺服器，便能從 Dreamweaver 加以預覽。您可以預覽來自本機 Dreamweaver 網站的檔案，或是預覽來自遠端或測試伺服器的檔案。
如需有關使用 BrowserLab 線上服務的詳細資訊 (包括使用 BrowserLab 搭配 Dreamweaver 的詳細資訊)，請參閱 www.adobe.com/go/lr_abl_tw。
Business Catalyst InContext Editing
Business Catalyst InContext Editing
Adobe Business Catalyst InContext Editing 是 Adobe Business Catalyst 的編輯組件，能讓用戶利用網頁瀏覽器，對內容進行簡單的變更。若要變更網頁，用戶只要瀏覽該網頁，登入 InContext Editing 後，再變更網頁內容即可。可供編輯的選項非常明確簡單，而且不需具備 HTML 語言或網頁編輯知識就可以使用這些選項。
不過，要讓用戶能夠在網頁上進行即時變更之前，您必須先使用 Dreamweaver 讓您的 HTML 網頁成為可編輯的網頁，做法則是在網頁上指定您要允許用戶編輯的區域。例如，您可能有一個包含文章標題和短文的新聞網頁，可以選取這個內容然後將其轉換成 InContext Editing 可編輯區域，讓登入 InContext Editing 的用戶可以直接在瀏覽器中編輯這些標題和短文。
本文件會告訴您如何在 Dreamweaver 中使用 InContext Editing 可編輯區域，不過 Adobe 也提供了其他資源，協助您使用 InContext Editing：
如需有關在瀏覽器中使用 InContext Editing 編輯網頁的文件，請參閱 www.adobe.com/go/learn_dw_incontextediting_browser_tw。
如需有關如何使用 InContext Editing 管理面板的文件，請參閱 www.adobe.com/go/learn_dw_incontextediting_administration_guide_tw。
如需有關 Adobe Business Catalyst 的詳細資訊，請造訪 www.businesscatalyst.com。
註解：
Adobe AIR 不支援 Adobe Business Catalyst InContext Editing。如果您使用 Dreamweaver 的 AIR Extension 匯出包含 InContext Editing 區域的應用程式，InContext Editing 功能將會失效。
建立 InContext Editing 可編輯區域
InContext Editing 可編輯區域是一組開啟標籤中包含 ice:editable 屬性的 HTML 標籤。可編輯區域會在頁面上定義一個可以讓用戶直接在瀏覽器中編輯的區域。
註解：
如果您要將 InContext Editing 可編輯區域新增到以 Dreamweaver 範本為基礎的頁面，新的 InContext Editing 可編輯區域就必須存在於已經可以編輯的區域內。
-
選取要轉換成可編輯區域的 div、th 或 td 標籤。
將插入點置於頁面上要插入新的可編輯區域的位置。
在 Dreamweaver 範本 (DWT 檔) 中只選取一個可編輯區域。
選取要設定成可編輯的其他頁面內容 (例如文字方塊)。
-
選擇「插入＞InContext Editing＞建立可編輯區域」。
-
選項會視您做的選擇而定。
如果選取了 div、th 或 td 標籤，Dreamweaver 會直接將此標籤轉換成可編輯區域。
如果要插入新的空白可編輯區域，請執行下列其中一項：
選取「在目前的插入點插入新的可編輯區域」，然後按一下「確定」。Dreamweaver 會在您的程式碼中插入一個開啟標籤中包含 ice:editable 屬性的 div 標籤。
如果您要讓 Dreamweaver 將選取範圍的上一層標籤設定成可編輯區域的容器元素，請選取「將上一層標籤轉換為可編輯區域」。只有某些特定的 HTML 標籤可以轉換：div、th 和 td。
註解：只有在上層節點完全符合轉換準則時，才可以使用這個第二選項。例如，它必須是其中一個已列出的可轉換標籤，而且不可以因為任何 InContext Editing 錯誤訊息中所列的錯誤而有所變更。
- 如果您已選取 Dreamweaver 範本的可編輯區域，請按一下「建立可編輯區域」對話方塊的「確定」。Dreamweaver 會以 div 標籤圍繞範本的可編輯區域，這個標籤是新的 InContext Editing 可編輯區域的容器。
- 如果選取了要設定成可編輯的其他內容，請執行下列其中一項：
- 如果您要用 div 標籤圍繞您所選取的任何項目並將其轉換成可編輯區域，請選取「用 DIV 標籤圍繞目前選取範圍，然後加以轉換」。Dreamweaver 用來圍繞內容的 div 標籤，作用就像是可編輯區域的容器。
註解：將 div 標籤新增到頁面時，可能會變更頁面的呈現和 CSS 規則的效果。例如，如果您的 CSS 規則會在 div 標籤周圍套用紅色邊框，當 Dreamweaver 以 div 標籤圍繞並轉換您目前的選取範圍時，周圍就會出現紅色邊框。如果您要避免發生這類衝突，可以重新撰寫會影響目前選取範圍的 CSS 規則，或是還原轉換 (「編輯＞還原」)，然後選取並轉換 Dreamweaver 不需要的支援標籤，以 div 標籤圍繞。
- 如果您要讓 Dreamweaver 將選取範圍的上一層標籤設定成可編輯區域的容器元素，請選取「將上一層標籤轉換為可編輯區域」。只有某些特定的 HTML 標籤可以轉換：div、th 和 td。
-
在「設計」檢視中，按一下可編輯區域的藍色索引標籤即可加以選取 (如果尚未選取的話)。
註解：如果您是在 Dreamweaver 範本中作業，請務必選取 InContext Editing 可編輯區域 (容器區域)，不要選取 Dreamweaver 範本的可編輯區域。
-
您可以在「可編輯區域」的「屬性」檢視窗中選取或取消選取各選項。用戶在瀏覽器中編輯可編輯區域的內容時，可以使用您所選取的選項。例如，如果您選取「粗體」選項，用戶就可以將文字設定成粗體；如果選取「編號清單和項目清單」選項，用戶就可以建立編號清單和項目清單；如果選取「連結」選項，用戶就可以建立連結；其餘皆依此類推。將滑鼠停留在每個選項的圖示上，可以查看該選項所啟用之功能的工具提示。
-
儲存頁面。
如果這是您第一次將 InContext Editing 功能加入到頁面，Dreamweaver 會通知您它要將 InContext Editing 支援檔案新增到您的網站：ice.conf.js、ice.js 和 ide.html。當您將網頁上傳到伺服器時，請務必同時上傳這些檔案，否則 InContext Editing 功能將無法在瀏覽器中運作。
建立 InContext Editing 重複區域
InContext Editing 重複區域是一組開啟標籤中包含 ice:repeating 屬性的 HTML 標籤。重複區域會在頁面上定義一個用戶在瀏覽器中進行編輯時可以「重複」和加入內容的區域。例如，如果您有一個標題，後面跟著一段文字，就可以將這些元素轉換成重複區域，讓用戶可以將其在某個頁面上複製。
除了新增以原始區域為基礎的重複區域之外，您也可以讓用戶選擇刪除區域、新增全新的區域 (不是以原始區域的內容為基礎)，以及上下移動區域。
建立重複區域時，Dreamweaver 會用另一個稱為重複區域群組的容器加以圍繞。這個容器 (開啟標籤包含 ice:repeatinggroup 屬性的 div 標籤) 作用就像是用戶可以新增到此群組之所有可編輯重複區域的容器。您無法將重複區域移出其重複區域的群組容器。此外，您不可以手動將重複區域群組標籤新增到頁面，Dreamweaver 會視需要自動為您新增。
註解：
從表格列 (tr 標籤) 建立重複區域時，Dreamweaver 會將重複區域群組屬性套用到上一層標籤 (例如 table 標籤)，不會插入 div 標籤。
如果您要處理已包含重複區域群組的頁面，而且要在現有群組的正後方新增重複區域，Dreamweaver 會偵測重複區域群組是否位於要新增的區域前方，並且讓您選擇是否要將區域新增到現有群組。您可以選擇將重複區域新增到現有群組，或是建立全新的重複區域群組。
註解：
如果您要將 InContext Editing 重複區域新增到以 Dreamweaver 範本為基礎的頁面，新的 InContext Editing 重複區域就必須存在於已經可以編輯的區域內。
若要在 Dreamweaver 中建立重複區域，請按照下列步驟執行。
-
請執行下列其中一項作業：
選取要轉換成重複區域的標籤。可能的標籤有很多：a、abbr、acronym、address、b、big、blockquote、center、cite、code、dd、dfn、dir、div、dl、dt、em、font、h1、h2、h3、h4、h5、h6、hr、i、img、ins、kbd、label、li、menu、ol、p、pre、q、s、samp、small、span、strike、strong、sub、sup、table、tbody、tr、tt、u、ul 和 var。
註解：只有 div 標籤可以同時包含可編輯區域屬性和重複區域屬性。
- 將插入點置於網頁上要插入新的重複區域的位置。
- 在 Dreamweaver 範本 (DWT 檔) 中只選取一個重複區域。
- 選取要設定成可重複的其他網頁內容 (例如標題和文字方塊)。
-
選擇「插入＞InContext Editing＞建立重複區域」。
-
選項會視您做的選擇而定。
如果選取了可轉換標籤，Dreamweaver 會直接將此標籤轉換成重複區域。
如果要插入新的空白重複區域，請執行下列其中一項：
選取「在目前的插入點插入新的重複區域」，然後按一下「確定」。
如果您要讓 Dreamweaver 將選取範圍的上一層標籤設定成此區域的容器元素，請選取「將上一層標籤轉換為重複區域」。只有特定 HTML 標籤可以轉換：a、abbr、acronym、address、b、big、blockquote、center、cite、code、dd、dfn、dir、div、dl、dt、em、font、h1、h2、h3、h4、h5、h6、hr、i、img、ins、kbd、label、li、menu、ol、p、pre、q、s、samp、small、span、strike、strong、sub、sup、table、tbody、tr、tt、u、ul 和 var。
註解：只有在上層節點完全符合轉換準則時，才可以使用這個第二選項。例如，它必須是其中一個已列出的可轉換標籤，而且不可以因為任何 InContext Editing 錯誤訊息中所列的錯誤而有所變更。
- 如果您已選取 Dreamweaver 範本的重複區域，請按一下「建立重複區域」對話方塊的「確定」。Dreamweaver 會以 div 標籤圍繞範本的重複區域，這個標籤是新的 InContext Editing 重複區域的容器。
- 如果選取了要設定成可重複的其他內容，請執行下列其中一項：
- 如果您要用 div 標籤圍繞您所選取的項目並將其轉換成重複區域，請選取「用 DIV 標籤圍繞目前選取範圍，然後加以轉換」。Dreamweaver 用來圍繞內容的 div 標籤，作用就像是重複區域的容器。
- 如果您要讓 Dreamweaver 將選取範圍的上一層標籤設定成重複區域的容器元素，請選取「將上一層標籤轉換為重複區域」。只有特定 HTML 標籤可以轉換：a、abbr、acronym、address、b、big、blockquote、center、cite、code、dd、dfn、dir、div、dl、dt、em、font、h1、h2、h3、h4、h5、h6、hr、i、img、ins、kbd、label、li、menu、ol、p、pre、q、s、samp、small、span、strike、strong、sub、sup、table、tbody、tr、tt、u、ul 和 var。
-
在「設計」檢視中，按一下重複區域的藍色索引標籤即可加以選取 (如果尚未選取的話)。請注意，Dreamweaver 會實際強制您為重複區域群組選取此標籤。這是因為所有重複區域都是在一個重複區域群組之內，您必須透過設定整個群組的選項來設定重複區域的選項。
-
在「重複區域群組」的「屬性」檢視窗中選取或取消選取各選項。有兩個可用選項：「重新排序」和「新增/移除」。如果選取「重新排序」，用戶在瀏覽器中進行編輯時即可上下移動重複區域。如果選取「新增/移除」，用戶在瀏覽器中進行編輯時即可新增或移除重複區域。預設為同時選取兩個選項，而且您必須固定選取至少其中一個。
-
儲存頁面。
如果這是您第一次將 InContext Editing 功能加入到頁面，Dreamweaver 會通知您它要將 InContext Editing 支援檔案新增到您的網站：ice.conf.js、ice.js 和 ide.html。當您將網頁上傳到伺服器時，請務必同時上傳這些檔案，否則 InContext Editing 功能將無法在瀏覽器中運作。
刪除區域
要刪除某個區域的最佳作法是使用該區域的「屬性」檢視窗。使用區域的「屬性」檢視窗可確保刪除與該區域關聯的所有程式碼。
選取可編輯區域、重複區域或重複區域群組。
在該區域的「屬性」檢視窗中，按一下「移除區域」按鈕。
指定用於格式化的 CSS 類別
Dreamweaver CS5 中已不再支援 InContext Editing 的「管理可用的 CSS 類別」功能。
InContext Editing 錯誤訊息
您無法將 InContext Editing 功能套用到包含 Script 標籤或伺服器端程式碼區塊的標籤
如果您的選取範圍包含伺服器端程式碼，Dreamweaver 將不允許您將其轉換成可編輯區域或重複區域。這個問題涉及用戶在瀏覽器中作業時，InContext Editing 用來儲存可編輯頁面的方式。當用戶在編輯後儲存頁面時，InContext Editing 會從該區域移除伺服器端程式碼。
目前選取範圍無法轉換或使用 DIV 標籤來圍繞，因為上層節點不允許將 DIV 做為子標籤
無法直接轉換要在頁面上轉換的選取範圍時，Dreamweaver 必須以 div 標籤圍繞選取範圍，這些標籤是新的可編輯或重複區域的容器。因此，您要轉換之項目的上一層標籤必須允許將 div 標籤當做子標籤。如果您嘗試要轉換之標籤的上一層標籤不允許使用 div 子標籤，則 Dreamweaver 將不允許您執行這項轉換。
目前選取範圍中已包含可編輯區域或已位於可編輯區域中。不允許使用巢狀的「可編輯區域」
如果您的選取範圍位於可編輯區域內，或是有一個可編輯區域位於這個選取範圍內，則 Dreamweaver 也不允許您執行這項轉換。InContext Editing 不支援巢狀可編輯區域。
可編輯區域不應該包含重複區域或重複區域群組
InContext Editing 可編輯區域不可包含任何其他 InContext Editing 功能。如果您嘗試新增重複區域或重複區域群組到可編輯區域，Dreamweaver 將不允許您執行轉換。
重複區域不應該包含重複區域群組或位於可編輯區域中
InContext Editing 可編輯區域不可包含任何其他 InContext Editing 功能。如果您嘗試新增重複區域或重複區域群組到可編輯區域，Dreamweaver 將不允許您執行轉換。此外，如果某個元素已經包含重複區域群組，Dreamweaver 也不會將此元素轉換成可編輯區域或重複區域。
目前選取範圍中已包含重複區域或已位於重複區域中。不允許使用巢狀的「重複區域」
如果您的選取範圍位於重複區域內，或是有一個重複區域位於這個選取範圍內，則 Dreamweaver 也不允許您執行轉換。InContext Editing 不支援巢狀重複區域。
選取範圍必須只包含一個 Dreamweaver 範本可編輯/重複區域，或包含在任何 Dreamweaver 範本可編輯區域中
使用 Dreamweaver 範本檔案 (.dwt 檔案) 時，必須遵守特定規則。若要將 Dreamweaver 範本可編輯/重複區域轉換成 InContext Editing 可編輯/重複區域，您必須在頁面上選取單一 Dreamweaver 範本可編輯/重複區域，然後加以轉換。若要轉換頁面上的其他選取範圍 (例如文字方塊)，這個選取範圍必須位於 Dreamweaver 範本可編輯區域內。
只有 DIV 標籤可以同時套用可編輯區域和重複區域的功能
如果您的選取範圍不是 div 標籤，而且已經套用了重複區域屬性，Dreamweaver 將不允許您同時套用可編輯區域屬性。只有 div 標籤可以同時套用可編輯區域屬性和重複區域屬性。
Dreamweaver 偵測到重複區域群組標籤位於重複區域之前
所有 InContext Editing 重複區域都必須位於重複區域群組內。當您在頁面上新增重複區域時，Dreamweaver 會偵測是否已有重複區域群組緊鄰在前。如果有的話，Dreamweaver 會讓您選擇將新的重複區域新增到已經存在的重複區域群組，或是建立一個包含這個新重複區域的新重複區域群組。
