大綱工具可讓您透過樹狀檢視瀏覽文件中的元素和片段。您可以在 [視窗] 選單中選擇顯示或隱藏大綱工具面板。
您可以在大綱工具中使用一些和在中心區域相同的操作方式來處理元素。舉例來說，大綱工具中的元素可藉由點選進行選取；在元素上按一下滑鼠右鍵，即可開啟包含該元素專用指令的彈出式選單；而按兩下有編輯對話方塊的元件，則可開啟相應對話方塊。
整理
對於有多個頁面的 HTML5 廣告和 HTML 文件，大綱工具會依文件中的每個頁面來整理其中的元素。在群組編輯模式中，您只會看到指定群組中的元素。
根據預設，元素在大綱工具中的顯示順序與進階模式時間軸中的圖層順序相同。您可以在設計檢視偏好設定中切換成 DOM 順序。
展開或收合元素：在大綱工具中按一下元素旁邊的箭頭，即可顯示或隱藏巢狀元素。
展開或收合所有巢狀元素：按兩下元素旁邊的箭頭，即可展開或收合位於該元素之下的所有元素。此外，按住 Ctrl (Windows)、⌘ 或 Alt (Mac) 鍵再點選箭頭，也可以產生相同效果。
重新排列元素：依需求將元素拖曳到清單中的相應位置，元素的目標移動位置會顯示一條黃線。您也可以將子項元素拖曳至其他父項元素下。
在元素之間建立巢狀結構：您可以將某個元素歸入另一個元素之下，只要將該元素拖曳到預定的父項元素上即可。系統會以黃色方塊框住預定的父項元素。
選取
選取的項目會同時反映在中心區域、進階模式時間軸和大綱工具中。也就是說，在其中一處選取了元素後，會同時在另外幾處選取該元素。Google Web Designer 會視需要切換至巢狀元素中的不同層級，或是不同頁面。當前父項元素的標籤則會以黃色顯示。
選取單一元素：按一下特定元素即可加以選取。
選取多個元素：您可以一次選取多個有相同父項元素的元素。
- 按住 Ctrl (Windows) 或 ⌘ (Mac) 鍵，然後逐一點選要選取的元素。
- 如要選取一系列元素，請點選第一個元素，然後按住 Shift 鍵，再點選最後一個元素。
取消選取元素：按住 Ctrl (Windows) 或 ⌘ (Mac) 鍵，然後按一下要取消選取的元素。
瀏覽元素內部：按兩下元素即可瀏覽其中項目，所選元素會變成當前查看的父項元素。您可以編輯現有的子項元素，也可以在父項元素之下的巢狀結構中加入新元素。如果該元素是附有編輯對話方塊的元件，按兩下即可開啟相應對話方塊。
元素類型和狀態
大綱工具會顯示每個元素的 ID、名稱或文字內容 (如果有)，以及代表每個元素所屬類型的圖示。其中還會顯示下列狀態圖示：
- 菱形圖示代表元素具有動態資料繫結。
- 引導圖層顯示的圖示可讓您經由點選的方式將圖層轉換回一般元素。
- 隱藏和鎖定的元素會顯示狀態圖示，您可以點選這類圖示，將相關元素取消隱藏或解除鎖定。如果將滑鼠游標懸停在未隱藏或未鎖定的元素上，即可顯示用來隱藏或鎖定該元素的圖示。
每種元素類型的圖示
頁面
| 主要頁面 | |
| 頁面 |
元素
| 群組 | |
| Div | |
| 圖片 | |
| amp-img (AMP 文件中的圖片) | |
| 影片元素 | |
| 文字容器 | |
| 編號清單 | |
| 項目符號清單 | |
| 連結 |
圖形
| 路徑 (由畫筆工具繪製) | |
| 矩形 | |
| 橢圓 | |
| 線條 |
元件
| 手勢元件 | |
| 圖片按鈕元件 | |
| 視差元件 | |
| 輕按區域元件 | |
| 輕觸通話/傳簡訊元件 | |
| 360° 圖片庫元件 | |
| 輪轉式圖片庫元件 | |
| 圖片庫導覽元件 | |
| 滑動式圖片庫元件 | |
| 轉換式圖片庫元件 | |
| amp-carousel 元件 | |
| 音訊元件 | |
| 影片元件 | |
| YouTube 元件 | |
| 3D 模型檢視器元件 | |
| 圖片效果元件 | |
| 粒子效果元件 | |
| Sprite 工作表元件 | |
| Swirl 元件 | |
| 按鈕元件 | |
| 核取方塊元件 | |
| 下拉式選單元件 | |
| 標籤元件 | |
| 數字輸入元件 | |
| 圓形按鈕元件 | |
| 滑桿元件 | |
| 文字欄位元件 | |
| 新增至日曆元件 | |
| 日期替換元件 | |
| 地圖元件 | |
| 街景服務元件 | |
| iframe 元件 | |
| 星級評等元件 |
背景元素
| 矩形背景 | |
| 橢圓形背景 | |
| 多邊形背景 |
片段
| 音訊片段 | |
| 短片或影像片段 |
狀態圖示
| 具有動態繫結或變化版本繫結 | |
| 引導圖層 | |
| 隱藏/顯示 (游標懸停時顯示) | |
| 鎖定/解除鎖定 (游標懸停時顯示) |
篩選功能
您可以篩選在大綱工具中顯示的元素清單。如有元素符合篩選器，其父項元素和其他祖系元素也會一併顯示，讓您瞭解該元素在文件結構中的位階。
如要篩選元素，請在「大綱工具」面板頂端按一下放大鏡圖示 旁邊的空格，然後輸入元素 ID、名稱屬性值、標記名稱或群組名稱的部分內容。系統也會比對文字元素的文字內容。如果輸入的是素材資源名稱，則可找到使用該素材資源的元件。
您也可以使用元素類型篩選器。
元素類型篩選器
大綱工具提供的篩選器可讓您選擇僅顯示特定類型的元素，例如文字或圖形。只要按一下面板頂端的圖示，大綱工具就會顯示相應類型的元素。如果使用了多個元素類型篩選器，則符合任一篩選器的元素都會顯示。
元素類型篩選器圖示
| 顯示圖片和影片 | |
| 顯示元件 | |
| 顯示文字 | |
| 顯示圖形 |