Adding custom image size for WordPress media Library
To add new custom image size for WordPress media gallery, we can use add_image_size() function.
<?php add_image_size( $name, $width, $height, $crop ); ?>
Example code in theme’s functions.php file
add_image_size( 'category-thumb', 300,160 ); // 300 pixels wide and 160 pixels height - resized
add_image_size( 'homepage-thumb', 220, 180, true ); // 220 pixels wide and 180 pixels height - cropped
Different crop modes
-
Set the image size by resizing the image proportionally (without distorting it):
add_image_size( 'custom-size', 220, 180 ); // 220 pixels wide by 180 pixels tall, soft proportional crop mode
-
Set the image size by cropping the image (not showing part of it):
add_image_size( 'custom-size', 220, 180, true ); // 220 pixels wide by 180 pixels tall, hard crop mode
-
Set the image size by cropping the image and defining a crop position:
add_image_size( 'custom-size', 220, 220, array( 'left', 'top' ) ); // Hard crop left top
Using the New Image Sizes in WordPress
-
For Featured Images
<?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'your-custom-size-name' ); } ?>
-
For General Media (PHP/Templates)
<?php echo wp_get_attachment_image( $post-id, 'your-custom-size-name' ); ?>
Recent Posts
- Automating Release Generation with GitHub Actions
- WP CLI Commands to Bulk Delete Entries in WordPress Database
- Split a Single CSV File into Multiple Files Using the Split Command - Bash
- Migrating code repo from BitBucket to GitHub
- Streamlining Development - Our Journey with Git, Bitbucket, and Jira
Your Questions / Comments
If you found this article interesting, found errors, or just want to discuss about it, please get in touch.