Skip to content

Simple WordPress ImgIX Plugin - For use with S3-Uploads

Notifications You must be signed in to change notification settings

rsoury/wp-imgix

Repository files navigation

WP ImgIX is a Wordpress Plugin to automatically load all your existing (and future) WordPress images via the imgix service for smaller, faster, and better looking images.

This plugin handles modifying WordPress image URLs to use the ImgIX service. It works very well with S3-Uploads

Installation

  1. Download the zipped main branch of this plugin from github.
  2. Extract the plugin to your plugins folder.
  3. Enable the plugin.
  4. Add define( 'WP_IMGIX_URL', 'your.imgix.net' ) to your wp-config.php file.
  5. If you're signing urls, Add define( 'WP_IMGIX_SIGNING_TOKEN', 'abcdefg123456' ) to your wp-config.php file.

Usage

Typically the above steps are all you need to do however you can use the following public facing functions and filters.

Functions

imgix_url( string $image_url, array $args = [] )

This function returns the ImgIX URL for a given image.

$image_url = 'https://my-bucket.s3.us-east-1.amazonaws.com/path/to/image.jpg';
$args      = [
	'x'  => '300'
	'y' => '300',
	'fit' => 'crop'
];

$url = imgix_url( $image_url, $args );

Filters

The following filters allow you to modify the output and behaviour of the plugin. The filters below can be added to your theme's functions.php to modify the behavior of your imgix URLs.

imgix_disable_in_admin

Defaults to true.

add_filter( 'imgix_disable_in_admin', '__return_false' );

imgix_override_image_downsize

Defaults to false. Provides a way of preventing ImgIX from being applied to images retrieved from WordPress Core at the lowest level, you might use this if you wanted to use imgix_url() manually in specific cases.

add_filter( 'imgix_override_image_downsize', '__return_true' );

imgix_skip_for_url

Allows skipping the ImgIX URL for a given image URL. Defaults to false.

add_filter( 'imgix_skip_for_url', function ( $skip, $image_url, $args ) {
	if ( strpos( $image_url, 'original' ) !== false ) {
		return true;
	}

	return $skip;
}, 10, 3 );

imgix_pre_image_url

Filters the ImgIX image URL excluding the query string arguments.

add_filter( 'imgix_pre_image_url', function ( $image_url, $args ) {
	if ( rand( 1, 2 ) === 2 ) {
		$image_url = str_replace( WP_IMGIX_URL, WP_IMGIX_URL_2, $image_url );
	}

	return $image_url;
}, 10, 2 );

imgix_pre_args

Filters the query string parameters appended to the imgix image URL.

add_filter( 'imgix_pre_args', function ( $args ) {
	if ( isset( $args['fit'] ) ) {
		$args['fill'] = 'blur';
	}

	return $args;
} );

imgix_remove_size_attributes

Defaults to true. width & height attributes on image tags are removed by default to prevent aspect ratio distortion that can happen in some unusual cases where srcset sizes have different aspect ratios.

add_filter( 'imgix_remove_size_attributes', '__return_true' );

Credits

Created by Web Doodle

Forked from HumanMade's Tachyon Plugin -- Special thanks to the HumanMade team for working on accelerated Wordpress projects.

Written and maintained by Ryan Soury.