joppuyo

A field for Advanced Custom Fields that forces the user to crop their image to specific aspect ratio or pixel size after uploading. Using an aspect ratio is especially useful in responsive image use cases.
After cropping, a new cropped image variant is created in the gallery and saved into the post. Thumbnails are also generated for the new image. User can re-crop the original image at any time from the post page.
The cropped image variants are hidden by default in the media browser and on the media page but you can view them by selecting the “list view” on the media page.
There are three modes of operation: aspect ratio, pixel size and free crop. You can select this option when creating the field in ACF field options.
<h4>Aspect ratio</h4>
Use this option if you want the image to be of specific aspect ratio like 16:9 but the pixel size is not important.
After selecting an image, user can select an area from the image that matches this aspect ratio. When crop button is pressed, the area is cropped from the original image.
If you need a smaller image size, you make use of WordPress’s thumbnail functionality to access a smaller version of the image.
<h4>Pixel size</h4>
Use this option if you need a specific pixel size image like 640×480. User will not be able to select an image smaller than the defined pixel size.
After selecting an image, user can select an area from the image they want, which can be larger than the pixel size but may not be smaller. The aspect ratio of the selection is locked according to the pixel size.
When crop button is pressed, the area is cropped from the original image. After the crop is complete, the image will be automatically scaled down to the pixel size. This means the final image will always be the specified size.
<h4>Free crop</h4>
Crop can be done freely, there are no aspect ratio limitations.
<h4>Requirements</h4>
<ul>
<li>WordPress 4.9 or later</li>
<li>PHP 5.6 or later</li>
<li>Advanced Custom Fields 5.8 or later (Pro or Free)</li>
</ul>
<h4>Compatibility</h4>
<ul>
<li>Polylang Pro</li>
<li>Enable Media Replace</li>
<li>
WP Offload Media, Media Cloud and other plugins that move media files to remote location
</li>
<li>
ACF 5.8 or later (Pro or Free)
</li>
</ul>
<h4>Thanks</h4>
Special thanks to Anders Thorborg for <a href="https://github.com/andersthorborg/ACF-Image-Crop" rel="nofollow ugc">ACF Image Crop</a> which served as a inspiration for this plugin. Also, thanks to Fengyuan Chen for the <a href="https://fengyuanchen.github.io/cropperjs/" rel="nofollow ugc">cropper.js</a> library!

Advanced Custom Fields: Image Aspect Ratio Crop Field

Wow, this plugin is absolutely PHENOMENAL! I sure hope that others will chip in and support this amazing developer. This plugin is perfect for allowing end users to add their own images without breaking your theme design.

I'm so glad I found this plugin.  My sincere thanks to the developer!

THE essential ACF Plugin

ACF field that allows user to crop image to a specific aspect ratio or pixel size

Presswell

benplum

Presswell Art Direction helps simplify how custom image thumbnail sizes are defined, cropped, and generated.
Features
<ul>
<li>Control image cropping with hot-spots</li>
<li>Select custom image sizes in the WordPress editor</li>
<li>Dynamically generate image thumbnails</li>
<li>Delete all cached thumbnails</li>
</ul>
Image Cropping
Presswell Art Direction adds the ability to set a focal point hot-spot for all images in the media library for fine grain cropping control. Simply identify where the subject of the photo is and the plugin will crop all custom image thumbnails to ensure it stays in frame.
Thumbnail Sizes
Presswell Art Direction adds an easy to use interface for defining and editing custom image thumbnail sizes. Custom image sizes will be available for selection when inserting images in the post editor.
Dynamic Images
Presswell Art Direction prevents custom image sizes from being generated automatically. Only standard WordPress thumbnails will be generated when a new image is uploaded. All other image sizes will be dynamically generated when called via code or requested via URL, saving server space when many custom image sizes are defined. Note: URL based image generation requires that <a href="https://codex.wordpress.org/Using_Permalinks" rel="nofollow ugc">pretty permalinks</a> are enabled.
<h4>Documentation</h4>
pwad_add_image_size( $args )
<ul>
<li>$args (array) (required) – Keyed array containing <code>name</code>, <code>key</code>, <code>height</code>, <code>width</code>, and optionally <code>thumbnails</code> values; Thumbnail keys are prefixed with parent’s key like ‘[size]-[thumbnail]’</li>
</ul>
Example:
<pre><code>pwad_add_image_size( array(
 'name' => 'Square',
 'key' => 'square',
 'width' => '1200',
 'height' => '1200',
 'thumbnails' => array(
 array(
 'name' => 'Medium',
 'key' => 'medium',
 'width' => '800',
 'height' => '800',
 ),
 array(
 'name' => 'Small',
 'key' => 'small',
 'width' => '400',
 'height' => '400',
 ),
 ),
) );
</code></pre>
pwad_get_image( $attachment_ID, $size_key, $thumbnail_key )
<ul>
<li>$attachment_ID (int) (required) – ID of image attachment</li>
<li>$size_key (string) (required) – Image size identifier; Overload using ‘[size]-[thumbnail]’ pattern</li>
<li>$thumbnail_key (string) (required) – Image size thumbnail identifier</li>
</ul>
Returns an image tag.
Example:
<pre><code>$square_large = pwad_get_image( $img_ID, 'square' );
$square_medium = pwad_get_image( $img_ID, 'square', 'medium' );
$square_small = pwad_get_image( $img_ID, 'square-small' ); // Overloaded
</code></pre>
pwad_get_image_src( $attachment_ID, $size_key, $thumbnail_key )
<ul>
<li>$attachment_ID (int) (required) – ID of image attachment</li>
<li>$size_key (string) (required) – Image size identifier; Overload using ‘[size]-[thumbnail]’ pattern</li>
<li>$thumbnail_key (string) (required) – Image size thumbnail identifier</li>
</ul>
Returns a keyed array containing the <code>file</code>, <code>url</code>, <code>path</code>, <code>height</code>, <code>width</code>, and <code>mime-type</code> values.
Example:
<pre><code>$square_large = pwad_get_image_src( $img_ID, 'square' );
$square_medium = pwad_get_image_src( $img_ID, 'square', 'medium' );
$square_small = pwad_get_image_src( $img_ID, 'square-small' ); // Overloaded
</code></pre>

Presswell Art Direction

Really easy to use, and integrated perfectly with the front end of the site without any extra javascript or CSS required. Perfect add-on.

Very well done

Control how custom image thumbnail sizes are defined, cropped, and generated.

Advanced Custom Fields: Image Aspect Ratio Crop Field vs Presswell Art Direction