Images to AVIF

开发者	kubiq
更新时间	2026年1月14日 17:23
捐献地址:	去捐款
PHP版本:	7.0 及以上
WordPress版本:	6.9
版权:	GPLv2 or later
版权网址:	版权信息

下载

1.0 1.1

详情介绍:

Statistics say that AVIF format can save more than a half of the page weight without losing images quality. Convert PNG, JPG, GIF and WEBP images to AVIF and speed up your web, save visitors download data, make your Google ranking better. Install also Images to WebP plugin if you want to have fallback to WebP and then to the original file.

automated test after plugin activation to make sure it will work on your server
works with all types of WordPress installations: domain, subdomain, subdirectory, multisite/network
works on Apache and NGiNX
image URL will be not changed so it works everywhere, in <img> src, srcset, <picture>, even in CSS backgrounds and there is no problem with cache
original files will be not touched
set quality of converted images
auto convert on upload
only convert image if AVIF filesize is lower than original image filesize
bulk convert existing images to AVIF ( you can choose folders )
bulk convert only missing images

Hooks for developers images_to_avif_sizes Maybe you want to disable AVIF for thumbnails

add_filter( 'images_to_avif_sizes', 'disable_images_to_avif_sizes', 10, 2 ); function disable_images_to_avif_sizes( $sizes, $attachmentId ){ unset( $sizes['thumbnail'] ); return $sizes; }

images_to_avif_htaccess Maybe you want to modify htaccess rules somehow

add_filter( 'images_to_avif_htaccess', 'modify_images_to_avif_htaccess', 10, 2 ); function modify_images_to_avif_htaccess( $rewrite_rules ){ // do some magic here return $rewrite_rules; }

images_to_avif_abspath Maybe you use roots.io/bedrock or other custom folder structure

add_filter( 'images_to_avif_abspath', 'modify_images_to_avif_abspath', 10, 2 ); function modify_images_to_avif_abspath( $abspath ){ return trailingslashit( WP_CONTENT_DIR ); }

$images_to_avif->convert_image() Maybe you want to automatically generate AVIF for other plugins

add_action( 'XXPLUGIN_image_created', 'XX_images_to_avif', 10, 2 ); function XX_images_to_avif( $image_path ){ global $images_to_avif; $images_to_avif->convert_image( $image_path ); }

安装:

Upload images-to-avif directory to the /wp-content/plugins/ directory
Activate the plugin through the 'Plugins' menu in WordPress

常见问题:

Plugin requirements

It should work almost everywhere ;) PHP 5.6 or higher GD or Imagick extension with AVIF support Enabled server modules: mod_mime, mod_rewrite

AVIF images stored location

AVIF images are generated in same directory as original image. Example: original img: /wp-content/uploads/2019/11/car.png avif version: /wp-content/uploads/2019/11/car.png.avif

How to get original image from the browser?

Just add ?no_avif=1 to the URL and original JPG/PNG will be loaded

How to check if plugin works?

When you have installed plugin and converted all images, follow these steps:

Run Google Chrome and enable Dev Tools (F12).
Go to the Network tab click on Disable cache and select filtering for Img (Images).
Refresh your website page.
Check list of loaded images. Note Type column.
If value of avif is there, then everything works fine.

NGiNX and Apache together

If you have some proxy setup or some other combination of NGiNX and Apache on your server, then probably .htaccess changes won't work and you will need to ask your hosting provider to disable NGiNX direct processing of image static files.

Apache .htaccess

Plugin should automatically update your .htaccess with needed rules. In case it's not possible to write them automatically, screen with instructions will appear. Anyway, here is how it should look like: ` AddType image/avif .avif RewriteEngine On RewriteCond %{HTTP_ACCEPT} image/avif RewriteCond %{REQUEST_FILENAME} "/" RewriteCond %{REQUEST_FILENAME} ".(jpg|jpeg|png|gif|webp)$" RewriteCond %{REQUEST_FILENAME}.avif -f RewriteCond %{QUERY_STRING} !no_avif RewriteRule ^(.+)$ $1.avif [NC,T=image/avif,E=avif,L] `

NGiNX config

After you activate plugin, screen with instructions will appear. Anyway, here is how it should look like: You need to add this map directive to your http config, usually nginx.conf ( inside of the http{} section ): `map $arg_no_avif $no_avif{ default ""; "1" "no_avif"; } map $http_accept $avif_suffix{ default ""; "~*avif" ".avif"; }` then you need to add this to your server block, usually site.conf or /nginx/sites-enabled/default ( inside of the server{} section ): location ~* ^/.+\.(png|gif|webp|jpe?g)$ { add_header Vary Accept; try_files $uri$avif_suffix$no_avif $uri =404; }

ISP Manager

Are you using ISP Manager? Then it's probably not working for you, but no worries, you just need to go to WWW domains and delete jpg|jpeg|png from the Static content extensions field.

Delete all generated AVIF images

There is no button to do that and it will also not delete generated AVIFs automatically when you deactivate the plugin, but if you really need this, you can run some shell command to achieve this: find . -type f -name "*.avif" -exec bash -c 'if [ -f "${1%.avif}" ]; then echo "Deleting $1"; rm "$1"; fi' _ {} \; This will find all the files with a .avif extension and if there is similar file with the exact filename, but without the .avif extension, then it will delete it.

更新日志:

1.1

optimize old images convert process
remove not working images_to_avif_extensions filter

1.0

First version

Images to AVIF

标签

下载

详情介绍:

安装:

常见问题:

更新日志: