技術文件目前產品線:WordPress 入門

WordPress「編輯媒體」(Edit Media)頁面完整教學

更新日期
閱讀時間
約 6 分鐘
來源狀態
generated-draft

本篇說明

本篇說明如何在 WordPress 後台使用「Edit Media」頁面管理媒體庫中的檔案資訊,包含標題、說明文字等欄位設定,以及圖片旋轉、縮放、裁切等非破壞性編輯功能的操作方式。

適合誰使用

自行管理 WordPress 網站媒體檔案的站長與內容編輯人員

開始前準備

  • 媒體檔案須已存在於媒體庫(Media Library)中

教學內容

如何進入 Edit Media 頁面

此頁面用於管理已儲存在媒體庫中的媒體項目資訊。

此頁面填寫的資料常被布景主題或外掛用於附件頁面與圖庫展示,也會做為圖片插入頁面時的預設值。

圖片一旦以單張圖片插入後,就會與媒體庫中的資料脫鉤,需改用 Image Details 畫面個別更新。

Edit media page showing the options
官方文件介面截圖:Edit media page showing the options

  1. 前往後台選單 Media > Library
  2. 點擊媒體項目名稱,或滑鼠移到名稱上後點擊出現的 Edit 連結。
  3. 也可以在新增媒體時,點擊出現的 Edit 連結進入此頁面。

Edit Media 頁面欄位說明

Title 為媒體名稱,會顯示在媒體庫畫面的 File 欄位中,也常出現在附件頁面與圖庫上。

Permalink 為此媒體附件頁面的網址,若沒有編輯按鈕,可在 Screen Options 啟用 Slug 欄位來修改連結。

File URL 為唯讀欄位,顯示媒體檔案的直接連結,並可點擊複製到剪貼簿。

  1. Caption 欄位填寫媒體的簡短說明。
  2. Alternate text 欄位填寫圖片的替代文字,用於無障礙輔助說明。
  3. Description 欄位填寫此媒體的詳細說明文字。
  4. 如需提供下載連結,可啟用 Download file 選項,讓使用者能在附件詳情畫面與媒體彈出視窗下載檔案。
  5. 完成修改後,於 Save 區塊點擊 Update 儲存變更,或點擊 Delete Permanently 永久刪除媒體。

更多欄位:Screen Options 中的隱藏設定

部分欄位預設不會顯示,需在頁面右上角的 Screen Options 分頁中開啟。

Screen options in edit media page
官方文件介面截圖:Screen options in edit media page

Discussion 欄位可開啟或關閉此媒體附件頁面的留言與 trackback 功能。

Author 欄位顯示並可修改此媒體的作者。

使用 Edit Image 編輯圖片

點擊 Edit Image 按鈕會開啟圖片編輯器畫面,提供多項圖片編輯功能。

Attachment details after clicking on edit image
官方文件介面截圖:Attachment details after clicking on edit image

Edit image options
官方文件介面截圖:Edit image options

所有編輯都是非破壞性的,可隨時將圖片復原到原始上傳規格。

圖片只能縮小,不能放大;建議先進行縮放,再進行裁切、翻轉或旋轉。

  1. 點擊圖片並拖曳滑鼠以選取裁切範圍,選取完成後點擊圖片上方的裁切圖示完成裁切。
  2. 使用 Rotate leftRotate right 按鈕,將圖片以 90 度為單位逆時針或順時針旋轉。
  3. 使用 Flip verticalFlip horizontal 按鈕,將圖片上下顛倒或左右翻轉。
  4. 如需縮放圖片,在輸入新尺寸的欄位上方會顯示原始尺寸做為參考,輸入新尺寸後點擊 Scale 按鈕套用。
  5. 若要復原變更,點擊 Restore Original Image 下拉選項,再按下 Restore Image 按鈕即可,先前編輯的副本不會被刪除。

    restore original image size after scaling the image
    官方文件介面截圖:restore original image size after scaling the image

  6. 進行裁切時,可在 Crop aspect Ratio 欄位指定比例(如 1:1、4:3、16:9),並按住 Shift 鍵拖曳以鎖定該比例。
  7. 選擇要套用編輯效果的範圍:All image sizes(全部尺寸)、Thumbnail(縮圖)或 All sizes except thumbnail(除縮圖外的所有尺寸)。

    Options for thumbnail settings
    官方文件介面截圖:Options for thumbnail settings

  8. 完成編輯後點擊 Save 儲存變更並返回 Edit Media 畫面,或點擊 Cancel 取消本次編輯的所有操作。

裁切用的鍵盤快速鍵

裁切圖片時可使用鍵盤快速鍵微調裁切框的位置與大小,方向鍵可為上下左右任一方向。

  1. 按方向鍵:移動裁切框 10 像素。
  2. 按 Shift + 方向鍵:移動裁切框 1 像素。
  3. 按 Ctrl + 方向鍵:調整裁切框大小 10 像素。
  4. 按 Ctrl + Shift + 方向鍵:調整裁切框大小 1 像素。
  5. 按 Shift 並拖曳:鎖定裁切的長寬比例。

介面名稱對照

  • Edit Media:用於管理媒體庫中已上傳媒體資訊的頁面。
  • Permalink:媒體附件頁面的網址連結。
  • Alternate text:圖片的替代文字,供無障礙輔助使用。
  • Download file:在附件詳情畫面提供下載連結的選項。
  • Restore Original Image:用來捨棄圖片修改並還原成原始檔案的下拉選項。
  • Crop aspect Ratio:設定裁切選取範圍的長寬比例。

注意事項

注意

圖片一旦以單張圖片插入頁面後,即與媒體庫資料脫鉤,之後修改需透過 Image Details 畫面個別處理。

注意

圖片只能縮小尺寸,無法放大,建議先縮放再進行其他編輯。

注意

裁切選取範圍的最小值等同於 Settings Media Screen 中設定的縮圖尺寸。

常見問題

圖片編輯後可以還原成原始檔案嗎?

可以。圖片編輯是非破壞性的,點擊 Restore Original Image 下拉選項並按下 Restore Image 按鈕,即可捨棄變更並還原成原始上傳的圖片,先前編輯過的版本副本並不會被刪除。

找不到 Permalink 的編輯按鈕該怎麼辦?

若 Permalink 旁沒有編輯按鈕,可以到 Screen Options 中啟用 Slug 欄位,再直接修改 slug 的值來變更網址。

官方來源

還是卡住了?

先把問題問清楚,通常比直接開工單更快。複製下面的結構,補上你的情況後送出。

用 AI 先釐清問題

/ai 我正在閱讀「WordPress「編輯媒體」(Edit Media)頁面完整教學」,目前卡在:

我已嘗試:

我看到的畫面/錯誤訊息:

請用一步一步的方式告訴我下一步。

需要我們實際進入網站調整設定、修改佈景主題或處理資料時,再建立 /task 工單。