從 WordPress 版本 6.5 開始，您可以在 WordPress 中上傳和使用 AVIF 圖像，就像現(xiàn)在使用 JPEG 或 PNG 圖像一樣 – 只要您的托管環(huán)境支持 AVIF。將圖像切換為 AVIF 格式可能會提高網(wǎng)站的性能和網(wǎng)站訪問者的體驗。
AVIF 圖像比 JPEG 小最多 50%，同時保持相同的圖像質(zhì)量。AVIF 圖像還支持多種顏色（包括 HDR），并且生成比 JPEG 更清晰的圖像，尤其是在細(xì)節(jié)豐富的區(qū)域。
AVIF 的優(yōu)勢
AVIF 圖像比 JPEG 圖像小得多，因此頁面加載速度更快，傳輸所需的帶寬更少。AVIF 圖像仍然享有 WordPress 默認(rèn)支持的響應(yīng)式圖像、獲取優(yōu)先級和延遲加載的所有優(yōu)點。
如何創(chuàng)建 AVIF 圖像？
許多圖像編輯工具都支持導(dǎo)出為 AVIF。您還可以使用命令行轉(zhuǎn)換工具或基于 Web 的開源工具，例如。將圖像保存為 AVIF 后，將它們上傳到 WordPress 并像使用任何其他圖像一樣使用它們。WordPress 還可以自動為您創(chuàng)建 AVIF。
如何在 WordPress 中使用 AVIF 圖像？
AVIF 圖像的工作方式與 WordPress 中的任何其他圖像格式類似，但有一些重要注意事項：
WordPress 中的 AVIF 取決于 Web 服務(wù)器圖像處理庫的支持（WordPress 內(nèi)置了對Imagick和LibGD圖像處理的支持）。您可以通過訪問“工具”->“站點運行狀況”，單擊“信息”選項卡并展開“媒體處理”部分，最后在支持的格式列表中查找“AVIF”來檢查wp- admin中是否支持 AVIF。
如果您的受眾群體中有大量使用不受支持的瀏覽器的用戶，請避免使用 AVIF 圖像，或?qū)g覽器排入隊列。
如何調(diào)整生成的 AVIF 圖像的壓縮級別？
過濾wp_editor_set_quality 器可用于設(shè)置質(zhì)量設(shè)置。傳入的mime類型可以按類型設(shè)置，例如：
// Use a quality setting of 75 for AVIF images.
function filter_avif_quality( $quality, $mime_type ) {
if ( 'image/avif' === $mime_type ) {
return 75;
}
return $quality;
}
add_filter( 'wp_editor_set_quality', 'filter_avif_quality', 10, 2 );
如何輸出無損 AVIF 圖像？
使用 100 的壓縮級別會將 AVIF 設(shè)置為無損模式。
當(dāng)我上傳 JPEG 時，WordPress 可以創(chuàng)建 AVIF 圖像嗎？
是的。開發(fā)人員可以使用image_editor_output_format過濾器來指定這種類型的上傳轉(zhuǎn)換。例如：
// Output AVIFs for uploaded JPEGs
function filter_image_editor_output_format( $formats ) {
$formats['image/jpeg'] = 'image/avif';
return $formats;
}
add_filter( 'image_editor_output_format', 'filter_image_editor_output_format' );
如果我使用 WordPress多站點，我的所有站點都可以使用 AVIF 圖像嗎？
否。多站點存儲創(chuàng)建站點時允許用戶上傳的文件類型。為了確保網(wǎng)絡(luò)上的所有現(xiàn)有站點都允許 AVIF 文件，您可以使用site_option網(wǎng)絡(luò) mu-插件中的過濾器將 avif 添加到所有網(wǎng)絡(luò)站點允許的文件類型中：
// Ensure all network sites include AVIF support.
function filter_site_option_upload_filetypes( $filetypes ) {
$filetypes = explode( ' ', $filetypes );
if ( ! in_array( 'avif', $filetypes, true ) ) {
$filetypes[] = 'avif';
}
return implode( ' ', $filetypes );
}
add_filter( 'site_option_upload_filetypes', 'filter_site_option_upload_filetypes' );
