在程式碼檢視模式中瀏覽內容

透過程式碼檢視模式，您可以查看其他專案檔案、前往文件中不同位置，並搜尋程式碼內的文字。

瀏覽檔案

當 Google Web Designer 處於程式碼檢視模式時，左側的「檔案」面板會以清單形式顯示專案資料夾中的檔案和子資料夾。一旦這些項目有所變更，這個面板就會自動更新。

開啟檔案

只要在面板中選取檔案，即可透過新分頁開啟。您可以開啟下列檔案類型：

Google Web Designer 建立的 .html 來源檔案

其他 .html 檔案*

.css*

.js*

.json*

.svg*

.xml*

^{* 只能在程式碼檢視模式中編輯。}

您也可以開啟圖片檔 (.jpg/.jpeg、.png、.gif) 進行查看。只要將滑鼠游標懸停在「檔案」面板中的圖片檔案名稱上，即可查看相關縮圖。

Google Web Designer 無法開啟的檔案會呈現灰色。

如要開啟其他專案或資料夾的檔案，請使用下列選單指令：[檔案] > [開啟...]。

篩選檔案清單

您可以在 [篩選檔案] 欄位輸入檔案名稱的部分文字，讓「檔案」面板只列出與篩選條件相符的檔案。

隱藏「檔案」面板

按一下「檔案」面板右上角的「收合」按鈕即可隱藏檔案清單。如要再次開啟該面板，請點選「展開」按鈕。

瀏覽文件

如果您先在設計檢視模式中選取特定元素，再切換到程式碼檢視模式，則游標會位於所選元素的相關程式碼。

前往特定的行或欄

按一下頁尾列中的行數或欄數，然後輸入新的值，再按下 Enter 鍵。

使用小導覽圖

視窗右側的小導覽圖會顯示整份文件的縮小版程式碼檢視畫面。編輯器中顯示的程式碼部分會在小導覽圖中醒目顯示。

您可以點選小導覽圖中的任意位置來前往文件內的對應部分，也可以向上或向下拖曳小導覽圖來捲動文件。

如要關閉小導覽圖，請前往偏好設定。

搜尋程式碼中的文字

如何尋找文字：

依序點選 [編輯] > [尋找]，或者按下 Ctrl + F 鍵 (Windows) 或 ⌘ + F 鍵 (Mac)，即可在視窗底部開啟搜尋列。

在 [尋找...] 欄位中輸入您的搜尋字詞。

依需求切換搜尋選項：

規則運算式 (.*)

區分大小寫 (Aa)

字詞完全相符 ()

限制在選取範圍中 ()

Google Web Designer 會列出與搜尋字詞相符的項目總數，並醒目顯示游標所在位置之後的第一個相符項目。

如要尋找下一個相符項目，請點選，或者按下 Ctrl + G 鍵 (Windows) 或 ⌘ + G 鍵 (Mac)。

如要尋找上一個相符項目，請點選，或者按下 Shift + Ctrl + G 鍵 (Windows) 或 Shift + ⌘ + G 鍵 (Mac)。

如要選取所有相符項目以便同時編輯，請點選 [尋找全部]。

按下 Esc 鍵或點選 [X] 即可關閉搜尋列。

如何尋找及取代文字：

依序前往 [編輯] > [尋找/取代]，或者按下 Ctrl + Shift + F 鍵 (Windows) 或 ⌘ + Shift + F 鍵 (Mac)，即可在視窗底部開啟搜尋及取代列。

在 [尋找...] 和 [取代...] 欄位中分別輸入您的搜尋字詞和取代字詞。

除了按照下列做法取代文字外，您也可以參考上文說明來尋找文字：

如要取代當前的相符項目並尋找下一個相符項目，請按一下 [取代]。

如要取代所有相符項目，請按一下 [全部取代]。