The Ten&Two Systems IMG Processor brings the power of PHP’s GD and ImageMagick libraries to WordPress. Once enabled, the plugin creates a suite of WordPress Shortcodes and WP-CLI Commands which can be used separately or in tandem to optimize the production and delivery of your site’s images.
Source images may be local or remote. Processed images are created on-demand and then cached, so later visitors receive the pre-processed image immediately. When the cache expires or the source is changed, a new version of the processed image is created automatically.
As a developer, the IMG Processor allows you to maintain just one (1) version of each site image. Creating new versions for new display contexts is simply a matter of adjusting shortcode parameters and reloading the page. Because caching depends on access dates, popular images are always ready-to-serve. Rarely visited versions, on the other hand, are periodically swept. For sites with many images and/or versions of those images, the IMG Processor can save significant disk space.
TL;DR
Resize a local image proportionally to a height of 300 pixels; output the new URL.
[img_fit output="url" height="300" source="/wp-content/uploads/image.jpg" /]
Resize; cache the result in WebP format and 72 DPI max; output an <img> tag.
[img_fit output="img" output_type="webp" output_dpi="72" height="300"]/wp-content/uploads/image.jpg[/img_fit]
Resize; then, trim 10 pixels from each edge; output an <img> tag.
[img_trim output="img" top="10" left="10" bottom="10" right="10"]
[img_fit output="url" height="320"]/wp-content/uploads/image.jpg[/img_fit]
[/img_trim]
Use the API to resize and display (no shortcode) with optional output_nocache=1 argument.
<img src="/wp-content/plugins/tenandtwo-img-processor/api.php?source=/wp-content/uploads/image.jpg&transform=fit&height=300&output_nocache=1" />
Use the WP-CLI to pre-cache.
wp img_process fit --height=300 /wp-content/uploads/image.jpgwp img_process crop --output=info --top=10 --left=10 --bottom=10 --right=10 \
$(wp img_process fit --height=320 /wp-content/uploads/image.jpg)
Shared Parameters
source– Required source image file path or URL.output– Shortcode or CLI result format –info,url,img,html,figure, …output_type– Cached image type –gif,jpg,png,webp, …output_dpi– Max DPI for cache image –0,72, …output_file– Cached image location, including name and type.
Shortcodes
[img_process/]– Call any IMG Processor shortcode, specified intransform.[img_info/]– Get info for a source image.[img_fit/]– Resize an image to fit within the specifiedwidthand/orheight.[img_fill/]– Resize and crop an image to cover the specifiedwidthandheight.[img_resize/]– Stretch an image to fit the specifiedwidthandheight.[img_crop/]– Extract awidthxheightportion of an image from thetop,left.[img_trim/]– Remove pixels from thetop,left,bottomandrightedges.[img_border/]– Add pixels to thetop,left,bottomandrightedges.[img_flip/]– Flip an image vertically or horizontally along thexoryaxis.[img_rotate/]– Rotate an image clockwise bydegrees.[img_scale/]– Scale an image by apercent.[img_zoom/]– Scale an image by apercent, thenfocuson awidthxheightportion.