0%

正威網路行銷工作室,專注於基隆、台北與全台客製化網頁設計,提供專業 RWD 響應式、SEO 搜尋引擎優化、品牌形象設計與網站維護託管服務。

搜尋文章
聯絡資訊
地址基隆市仁二路 220 號 5 樓
追蹤我們

WordPress 限制上傳檔案類型:upload_mimes 寫法與 JPG、PNG、WebP、SVG 格式選擇

兩隻手指觸碰發光的 SEO 字樣

WordPress 的媒體庫預設可以上傳很多種檔案:圖片、PDF、Word 與 Excel 文件、音樂、影片都可以。如果網站有好幾位作者,你可能會希望大家只能上傳圖片,避免媒體庫塞滿大型影片或來路不明的檔案;反過來,也有人想開放某種預設不能上傳的格式。

這篇整理 upload_mimes 的用法,以及上傳圖片時該選什麼格式、壓縮品質要不要調整。(原本另一篇〈wordpress上傳圖片格式的秘訣〉的內容已經整合到這裡。)

開始之前:程式碼放在哪裡?

下面的 PHP 程式碼請加到子主題的 functions.php,或用 Code Snippets 外掛新增,不要直接改主題本身的檔案,否則主題一更新就會被覆蓋。動手前先備份網站,更多說明可以參考WordPress functions.php 實用程式碼整理。

WordPress 怎麼決定能不能上傳?

WordPress 內部有一份「允許的檔案類型」清單,每一項是「副檔名 → 檔案類型(MIME type)」,例如 jpg|jpeg|jpe 對應 image/jpeg。上傳的檔案副檔名不在清單裡,就會被拒絕。

SVG、PHP、執行檔這類有安全風險的格式,預設就不在清單裡。upload_mimes 這個篩選器(filter)可以讓你修改這份清單。

寫法一:媒體庫只能上傳圖片

PHP
add_filter( 'upload_mimes', function ( $mimes ) {
    return array(
        'jpg|jpeg|jpe' => 'image/jpeg',
        'png'          => 'image/png',
        'gif'          => 'image/gif',
        'webp'         => 'image/webp',
    );
} );

這段會把整份清單換成只有四種圖片格式,所有人(包含管理員)都只能上傳這幾種。

跟舊版的寫法比,拿掉了三種格式:

  • BMP、TIFF:檔案很大,TIFF 在大部分瀏覽器也無法直接顯示,不適合放在網頁上。
  • ICO:網站小圖示(Site Icon)用 PNG 或 JPG 上傳就可以,WordPress 會自動產生需要的尺寸。

注意:只留圖片的話,PDF 型錄、影片這些檔案也都不能上傳了,套用前先確認網站是否需要。

寫法二:只限制一般作者,管理員不受影響

PHP
add_filter( 'upload_mimes', function ( $mimes ) {
    // 管理員維持 WordPress 預設的清單
    if ( current_user_can( 'manage_options' ) ) {
        return $mimes;
    }
    return array(
        'jpg|jpeg|jpe' => 'image/jpeg',
        'png'          => 'image/png',
        'gif'          => 'image/gif',
        'webp'         => 'image/webp',
    );
} );

manage_options 是只有管理員才有的權限,編輯、作者這些角色都會套用限制。

寫法三:從預設清單拿掉某些類型

不想全部換掉,只是不讓大家上傳影片與音樂(這類檔案很吃主機空間,影片建議放到 YouTube 再嵌入):

PHP
add_filter( 'upload_mimes', function ( $mimes ) {
    foreach ( $mimes as $ext => $type ) {
        if ( str_starts_with( $type, 'video/' ) || str_starts_with( $type, 'audio/' ) ) {
            unset( $mimes[ $ext ] );
        }
    }
    return $mimes;
} );

str_starts_with() 是 PHP 8 的函式,WordPress 5.9 之後在舊版 PHP 上也可以使用。

可以開放上傳 SVG 嗎?

SVG 是向量圖,放大不會模糊,很適合 Logo 與圖示。但 SVG 其實是一個文字檔,裡面可以寫 JavaScript。如果有人上傳了藏有惡意程式的 SVG,別人直接打開這個檔案時,程式就會在你的網域底下執行,可能被用來竊取登入狀態。這就是 WordPress 預設不允許 SVG 的原因。

所以:

  • 不要只在 upload_mimes 加一行 svg 就開放,這樣上傳的檔案沒有經過任何檢查。
  • 真的需要,請使用會清理 SVG 內容的外掛(例如 Safe SVG),並且只讓管理員上傳。
  • 網站固定使用的 Logo、圖示,也可以由製作網站的人直接放進主題檔案,不經過媒體庫。
  • 不要為了方便在 wp-config.php 加上 ALLOW_UNFILTERED_UPLOADS,它會讓管理員可以上傳任何類型的檔案,帳號一旦被盜,風險很大。

多一層保險:uploads 資料夾禁止執行 PHP

限制副檔名之外,再讓上傳資料夾裡的 PHP 檔案無法執行,就算真的有惡意檔案混進來也跑不起來。在 wp-content/uploads/ 資料夾裡新增一個 .htaccess(Apache、LiteSpeed 主機適用):

Apache (.htaccess)
<FilesMatch "\.(php|phtml|phar)$">
  Require all denied
</FilesMatch>

很多安全性外掛也有同樣的選項,擇一使用即可。極少數外掛會在 uploads 資料夾裡放 PHP 檔案,加了之後如果某個外掛功能異常,再把這個 .htaccess 移除。

圖片格式怎麼選?

  • JPG:照片。檔案小,但不能有透明背景。
  • PNG:螢幕截圖、有文字的圖片、需要透明背景的 Logo。拿來存照片會非常大。
  • WebP:可以取代 JPG 和 PNG,同樣畫質下檔案通常更小,也支援透明背景,現代瀏覽器都能顯示。WordPress 5.8 之後可以直接上傳。
  • AVIF:檔案比 WebP 更小,WordPress 6.5 之後支援,但要主機的圖片處理程式也支援,才能產生各種尺寸的縮圖。
  • GIF:只有簡單的動畫才用,檔案通常很大;長一點的動畫改用短影片會小很多。
  • SVG:Logo、圖示,注意上面提到的安全問題。

想知道主機能不能處理 WebP、AVIF,可以到「工具 → 網站健康狀態 → 資訊」,展開「媒體處理」區塊,看支援的檔案格式。

iPhone 拍的 HEIC 照片,建議上傳前先轉成 JPG。較新的 WordPress 在主機支援時會自動轉檔,但不是每台主機都支援。

上傳前也記得把圖片縮到實際需要的尺寸(一般內文圖片寬度 1200~2000px 就很夠),再用 Squoosh 之類的工具壓縮。更多圖片瘦身的方法,請看WordPress 網站加速完整攻略。

上傳圖片的壓縮品質:不要設成 100

舊版文章說「WordPress 上傳圖片會自動壓縮成 90%」,並建議用程式碼改成 100%。這兩點現在都需要更正:

  • WordPress 產生縮圖時,JPG 的預設品質現在是 82(很早以前才是 90)。
  • 這個品質設定影響的是 WordPress 自動產生的各種尺寸(縮圖、中型、大型),你上傳的原始檔案不會被重新壓縮。例外是尺寸超過 2560px 的大張照片:WordPress 會另外產生一張縮小的「-scaled」版本當作主要圖片,原圖仍然保留在主機上。
  • 設成 100 會讓每一張縮圖都變大很多,肉眼卻幾乎看不出差別,反而拖慢網站。

如果覺得縮圖有明顯的壓縮痕跡,稍微調高一點就好:

PHP
add_filter( 'wp_editor_set_quality', function ( $quality, $mime_type ) {
    if ( 'image/jpeg' === $mime_type ) {
        return 88;
    }
    return $quality;
}, 10, 2 );

舊版用的 jpeg_quality 篩選器現在也還能用,但只對 JPG 有效;wp_editor_set_quality 可以依照格式分別設定,WebP 也適用。

調整之後只會影響新上傳的圖片。舊圖片要重新產生縮圖(可以用 Regenerate Thumbnails 這類外掛)才會套用新的品質。

延伸閱讀

媒體庫管得好,網站比較不容易被塞進來路不明的檔案。正威網路行銷是 25 年經驗的基隆網頁設計工作室,提供客製化網頁設計與網站維護託管,歡迎來聊聊。

分享這篇文章

返回文章列表更多「Wordpress代碼教學」文章

發表留言

還沒有人留言,歡迎第一個分享你的想法或問題。留言經審核後才會顯示,Email 不會公開。

讓我們一起打造
您的專屬網站!