編碼單一檔案 HTML 簡報的投影片格式、基於層級的進度列、導覽規則與章節結構。
npx clawhub@latest install presentation-structurePresentation Structure 技能賦予 AI 代理人深入了解特定單一檔案 HTML 簡報(presentation/index.html)的建構與維護方式。其內容涵蓋投影片 data-slide 編號格式、4 層旅程進度條系統、鍵盤/觸控導覽、章節分隔符號慣例,以及在編輯後安全重新編號投影片的規則。當您希望代理人能夠讀取、修改或產生符合此簡報架構的投影片,且不破壞導覽功能或層級進度條時,請安裝此技能。
npx clawhub@latest install presentation-structure點擊本頁頂部的 安裝 按鈕即可一鍵設定
data-slide 屬性與 goToSlide() 目錄參照。section-slide class、data-level 屬性與 section-desc 內容。goToSlide() 呼叫中的缺漏、重複或不符之處。presentation/index.html 單一檔案格式。此技能編碼了三種投影片類型——一般投影片、層級轉換區段投影片,以及標題投影片——以及所需的 HTML 屬性(data-slide、data-level、CSS 類別)。代理程式了解哪些屬性是必要的、哪些是選用的,以及哪些元素(例如 .level-badge)不得在 HTML 中硬式編碼。
與累計百分比不同,此簡報採用四個獨立層級(low、medium、high、pro),分別對應 25 / 50 / 75 / 100% 的進度條填充量。Presentation Structure 會精確記錄哪些投影片範圍會觸發各個層級、哪些投影片會沿用前一層級,以及進度條在第 1 張投影片上為隱藏狀態,並在第一個 data-level 轉場發生前保持空白。
每次進行任何結構性編輯後,代理程式必須將所有 data-slide 屬性從 1 開始依序重新編號,更新目錄/旅程地圖投影片中每個 goToSlide() 的呼叫,並確認不存在任何間隔或重複。Presentation Structure 說明文件指出,totalSlides 會從 DOM 自動計算,無需手動更新。
此技能涵蓋用於目錄連結的 goToSlide(n) 函數、自動計算的 totalSlides 值,以及支援的輸入方式:方向鍵、空白鍵與觸控滑動。這使代理能夠在重新編號後驗證目錄連結的一致性。
章節分隔符號遵循精確的格式:section-slide 類別、選用的 data-level、一個 section-number 段落、一個 <h1> 標題,以及一個命名層級的 section-desc 段落。Presentation Structure 讓代理人了解完整的預期標記結構,使新生成的章節能夠立即符合規範。
使用者請求代理在第 46 張投影片之後插入新的「第 7 部分」章節。Presentation Structure 技能指示代理建立一個 section-slide div,並賦予下一個連續的 data-slide 編號,加入適當的 data-level,重新編排所有後續投影片的編號,並更新目錄投影片中每一個 goToSlide() 的呼叫。
代理程式掃描 presentation/index.html,檢查是否存在缺漏或重複的 data-slide 值,並將每個 goToSlide() 呼叫與實際投影片編號進行交叉核對,回報任何不符之處——此任務完全由 Presentation Structure 技能中編碼的重新編號規則所支援。
使用者希望取得各投影片所屬旅程層級的摘要。代理人運用 Presentation Structure 技能中的層級轉換對照表,在無需讀取整份 HTML 檔案的情況下,精確產生投影片範圍、data-level 數值及對應進度條填充百分比的對應關係。
當被要求建立新的投影片框架時,代理程式會使用 Presentation Structure 技能中的精確 HTML 範本——選擇正確的類別(title-slide、section-slide 或一般的 slide),放置正確的屬性,並了解應在來源 HTML 中省略 .level-badge,因為它是在執行時期由 JS 動態注入的。
npx clawhub@latest install presentation-structure登入後撰寫評價
尚無評價。來分享你的使用體驗吧!