媒體庫：圖片散在各處的日子結束了，收進一個地方管

課程封面、部落格圖、商品圖、自訂 HTML 頁的插圖——分散在各功能頁 upload 上去。問題：三個月後不知道「哪張圖在哪、哪些沒在用了、某張圖換了會影響哪些頁面」。後台「媒體庫」就是為這設計的：這裡集中顯示你上傳的所有圖片與檔案，依類型分類，可複製網址或刪除。

🔍 點擊放大

這頁做的事（照實列）

• 依類型分類：圖片、PDF、Word、Excel 分開，不用混在一起翻
• 搜尋：搜尋檔名（例：logo、slash、cover），快速找到那張圖
• 複製全部圖片網址：一鍵把全頁的圖片 URL 複製出來——特別適合餵給 AI（「這些圖幫我改成 XX 風格」）
• 上傳：支援 webp、PDF、Word、Excel 等
• 從舊網站抓圖：搬遷時把舊站的圖自動拉進媒體庫
• 清理沒在用的檔案：刪除未被任何頁面引用的圖片，省空間
• 上傳時去背：上傳圖片時自動去除背景

為什麼「清理沒在用的檔案」是重點

圖片是網站空間的大戶。你上傳的 200 張圖，可能 120 張「只上傳過、從未在任何頁面引用」——佔空間、拖慢載入（瀏覽器載入圖片時要逐一去媒體庫的 URL 拉）。

「清理沒在用的檔案」就是幫你清那 120 張。但先確認真的沒在用：有些圖可能在「只有你自己知道」的頁面（隱藏頁、測試頁）引用，清掉會壞圖。清之前：

1. 搜尋你記得在用的圖，確認它們的「被引用狀態」是「有引用」
2. 只清「無引用」的
3. 留個備份清單（把要刪的 URL 記下來），萬一發現壞圖，可以立刻重傳

「複製全部圖片網址」＋AI：一個實用動線

畫面裡這個按鈕的用途寫得很白：把全部圖片網址複製給 AI。實際用法：

• 把全站圖片 URL 餵給 AI，問「這些圖哪幾張風格不統一？」
• 把某門課程的所有圖片網址餵給 AI，問「哪張適合當封面？」
• 把商品圖 URL 餵給 AI，問「這些圖的 alt 該寫什麼？」

前提：圖片要先有 alt 文字（無障礙＋SEO），餵 AI 才有用。沒寫 alt 的圖，AI 只能看 URL，猜不出內容。

跟「og:image / 縮圖」的關係

之前那篇 og:image 指 localhost 的 bug，跟媒體庫沒直接關係（那是後端產出），但「哪張圖該當某頁的 og:image」的決定，落在媒體庫：你得先知道「這門課的封面圖是哪張」。媒體庫依類型分類，方便你「翻一遍、挑一张」當 og:image 的來源。

不要做的事

• 上傳前不壓縮：一張 5MB 的原圖上傳，載入速度直接拖垮頁面。上傳前壓縮到 300KB 以內（webp 格式最優），媒體庫才能跑起來
• 檔名全亂：IMG_20260815_093215.jpg 這種檔名，清理事時根本不知道哪張是哪頁的。上傳前改名成 course-cover-xxx 這種有意義的檔名
• 清檔案前不記備份清單：清錯一張會壞一個頁面，留清單能 5 分鐘修好；不留清單要 debug 到懷疑人生
• 用圖片當「檔案庫」：媒體庫是「顯示給訪客的圖」，不是你的個人硬碟。內部文件放別的地方

一句話：媒體庫是「你的站有幾張圖、每張圖在哪、哪張該刪」的唯一真相來源。把「散在各頁上傳」的動線收進來，維護成本會掉一個量級。