LearnDash 的課程骨架先用 Course、Section Heading、Lesson 和 Topic 排好。骨架完成後，接下來才是把學生真的要看的影片、文字、圖片和講義放進單元。
這一課用「在家手沖咖啡」的 Lesson「認識手沖器材」示範。完成後，學生進到這個單元會先看到影片，接著閱讀重點整理，最後下載器材清單。
影片示範使用 Bunny Stream。這次不處理 Bunny 帳號建立、計費、播放器外觀或安全設定，只教你從現有影片取得 Embed Code，再放進 LearnDash。
Bunny 裡還沒有影片時，可以先完成 Bunny Stream 課程影片上傳與安全設定，準備好 Embed Code 再回來操作。
WordPress 和 Bunny Stream 各自負責什麼？
我們不把課程主影片直接上傳到 WordPress 媒體庫。WordPress 負責課程頁、圖文與附件；Bunny Stream 負責存放和播放影片。
| 內容 | 放在哪裡 |
|---|---|
| 課程架構、單元頁面 | LearnDash |
| 課程影片 | Bunny Stream |
| 文字、圖片 | Lesson 或 Topic 的內容區 |
| PDF 講義 | WordPress 檔案區塊 |
這樣分開後，更新單元文字時不用重新處理影片；替換影片時，也不用重做整個課程頁。
先認識這一課會看到的英文
| 畫面上的英文 | 中文意思 | 這一課的用途 |
|---|---|---|
| Stream | 串流影片服務 | 進入 Bunny 的影片功能 |
| Video Library | 影片庫 | 存放同一組影片 |
| Videos | 影片清單 | 找到要放進課程的影片 |
| Embed Code | 嵌入碼 | 貼到 WordPress 顯示播放器 |
| Custom HTML／自訂 HTML | HTML 程式碼區塊 | 放 Bunny 提供的 iframe |
| File／檔案 | 檔案區塊 | 加入 PDF 講義 |
不需要先把這些英文背起來。知道每個名稱在這一課負責什麼，操作時比較不會找錯位置。
開始前先準備三樣內容
- Bunny Stream 裡已經有一支處理完成的影片。
- 一段單元說明和一張要放進內文的圖片。
- 一份要讓學生下載的 PDF 講義。
如果 Bunny 裡還沒有影片，先不要急著進 LearnDash。等影片完成上傳和處理，再回來取得 Embed Code，操作會比較順。
1.在 Bunny Stream 找到影片的 Embed Code
登入 Bunny 後，打開 Stream，進入存放課程影片的 Video Library，再從影片清單打開這一課要使用的影片。
在影片詳細頁右側打開 Embed，確認 Responsive 開啟、Autoplay 關閉，再複製 Bunny 提供的完整 iframe。不要只複製播放網址，也不要把 API Key 或 Token authentication key 貼進 WordPress。
Embed Code 看起來會是一段程式碼，裡面包含 Bunny 播放器網址、Video Library ID 和 Video ID。這些內容不用自己改，完整複製即可。
2.打開要放教材的 LearnDash Lesson
回到 WordPress 後台，打開 Course Builder，找到「認識手沖器材」。這是學生會進入的 Lesson，也是這次要放教材的位置。
進入 Lesson 後，先停在 Lesson page。中央的 Add Lesson content. 就是單元內容區，操作方式和一般 WordPress 文章相同。
如果你要編輯的是 Topic，做法也一樣。差別只在這份內容會放在某個 Lesson 底下的小節，不是主要單元。
3.用自訂 HTML 區塊加入 Bunny 影片
點左上角的區塊插入器，在搜尋欄輸入「自訂 HTML」，再選擇 自訂 HTML 區塊。
加入區塊後，點 編輯 HTML 程式碼，把剛才從 Bunny 複製的完整 Embed Code 貼進 HTML 欄位，再關閉編輯視窗。
區塊編輯器可能只顯示「自訂 HTML」的預覽卡片，不一定直接播放影片，所以最後仍要從前台檢查。不要把 Embed Code 貼在一般段落區塊，否則頁面可能只會顯示一串程式碼。
4.在影片下面加入圖文說明
影片放好後，在下面加入標題、段落和圖片。這些內容不是把影片逐字打一次，而是整理學生看完後需要記住的重點。
以「認識手沖器材」為例，可以先放「這一課的重點」，再補一段器材準備說明和一張器材圖片。學生忘記某個名稱時，不用重新拖整段影片就能找到答案。
一個單元內容很多時，可以拆成幾個 H2 或 H3；如果已經長到不好閱讀，就回到 Course Builder，把內容拆成 Topic，不要讓一個 Lesson 一直往下堆。
5.用檔案區塊加入 PDF 講義
再次打開區塊插入器，搜尋「檔案」，選擇 WordPress 內建的 檔案 區塊。
上傳 PDF 後，把連結文字改成學生看得懂的名稱，例如「下載手沖器材清單」。不要只留下原始檔名，像是 coffee-v3-final.pdf，學生很難判斷裡面是什麼。
這份 PDF 只屬於目前的 Lesson，所以直接放在內文最後面最清楚。學生看完影片和重點後，就能順著往下下載。
6.更新 Lesson，再從學生畫面檢查
內容完成後，先點右上角的更新或儲存，再開啟前台預覽。這一步不要只確認「有看到內容」，要實際操作一次。
- 影片播放器有正常出現，也能開始播放。
- 標題、段落和圖片的順序正確。
- PDF 連結名稱看得懂，而且真的可以下載。
- 手機畫面沒有出現播放器超出內容寬度的狀況。
這四項都正常，才算完成一個可以交給學生使用的單元。
如果儲存後 iframe 不見了：先檢查目前登入帳號是否有貼入未過濾 HTML 的權限。權限不足時，WordPress 可能會在儲存時移除 iframe。
常見問題
課程影片可以直接上傳 WordPress 媒體庫嗎？
不是完全不行，但我們不建議把課程主影片當成一般媒體檔案上傳。影片通常比圖片和 PDF 大很多，會增加主機空間、流量與備份負擔。這一課讓 WordPress 負責課程頁，Bunny Stream 負責影片播放。
教材要放在 Lesson 還是 Topic？
主要教學內容先放 Lesson。一個 Lesson 太長、裡面有幾個明確小主題時，再拆成 Topic。內容不多就不用硬拆，學生少點一層反而比較好找。
貼上 Bunny Embed Code 後沒有播放器，要先檢查什麼？
區塊編輯器只顯示自訂 HTML 預覽卡片不一定是錯誤，先從前台預覽確認。前台仍沒有播放器時，再檢查 iframe 是否完整、Bunny 影片是否處理完成，以及目前網站網域是否已加入 Allowed domains。
PDF 要放在內文，還是 LearnDash Materials？
示範的 PDF 只屬於目前的 Lesson，所以直接用檔案區塊放在內文最後。學生看完內容就能下載。若之後要把多份教材集中顯示，再另外規劃 LearnDash Materials，先不要兩邊重複放同一份檔案。
下一步
這一課先完成一個有影片、圖文和 PDF 的 Lesson。接著可以用同樣做法補其他 Lesson；內容太長時，再拆成 Topic。
課程內容放好後，可以接著建立 LearnDash 測驗，讓學生看完內容後回答問題，也方便開課的人確認學習結果。
照著做如果畫面跟這裡不一樣，或者不確定課程內容該怎麼安排、想連整個網站外包給我們製作，歡迎與我們聯絡。