Working Smarter with WordPress Images

For over a decade I’ve been wasting time doing the same tedious tasks in WordPress. I decided I needed to get a grip.  Here’s 5 things I’ve started doing when working with images.

1. Automatically add Image Meta-data

Habitually, I was good at adding meaningful (SEO friendly) names to my images files, but in WordPress I so often got bored of removing the dashes (hyphens)  Then there would be the job of copying and pasting my title to my alt text.  I would, at least do it, but clients – not so much!

WordPress Image Metadata

The solution:

This fabulous post by Francisco Ruiz .  All that was needed was his snippet added to my child themes functions.php and we were good.  You can see from the code comments you can remove fields that don’t need to be populated.

/* Automatically set the image Title, Alt-Text, Caption & Description upon upload
--------------------------------------------------------------------------------------*/
add_action( 'add_attachment', 'my_set_image_meta_upon_image_upload' );
function my_set_image_meta_upon_image_upload( $post_ID ) {

	// Check if uploaded file is an image, else do nothing

	if ( wp_attachment_is_image( $post_ID ) ) {

		$my_image_title = get_post( $post_ID )->post_title;

		// Sanitize the title:  remove hyphens, underscores & extra spaces:
		$my_image_title = preg_replace( '%\s*[-_\s]+\s*%', ' ',  $my_image_title );

		// Sanitize the title:  capitalize first letter of every word (other letters lower case):
		$my_image_title = ucwords( strtolower( $my_image_title ) );

		// Create an array with the image meta (Title, Caption, Description) to be updated
		// Note:  comment out the Excerpt/Caption or Content/Description lines if not needed
		$my_image_meta = array(
			'ID'		=> $post_ID,			// Specify the image (ID) to be updated
			'post_title'	=> $my_image_title,		// Set image Title to sanitized title
			'post_excerpt'	=> $my_image_title,		// Set image Caption (Excerpt) to sanitized title
			'post_content'	=> $my_image_title,		// Set image Description (Content) to sanitized title
		);

		// Set the image Alt-Text
		update_post_meta( $post_ID, '_wp_attachment_image_alt', $my_image_title );

		// Set the image meta (e.g. Title, Excerpt, Content)
		wp_update_post( $my_image_meta );

	} 
}

 

2.  Auditioning  Images

If you’re like me you are logo version 4 before it’s the right one Then there’s the various crops get that perfect homepage hero image. We can delete the unused ones (if we can work out which they are), but we still have odd file names.

The solution:

A neat plugin from ShortPixel called “Enable Media Replace“.  It removes the need to delete and rename. Tip: make sure you do a hard refresh browser and clear other caches.

 

3.  Getting rid of all those Thumbnails

Recently, I realised that I hardly ever used a small thumbnail, yet would like WordPress create them and take up hard drive space. Now I will think about each project and remove those not needed.

Zero Wp Thumbnails

4. Adding and renaming Custom Thumbnails

Occasionally,  and usually with product based sites,  I may need more sizes or I may need descriptive name to help clients pick the right image. In the example below you can change the product names and sizes.  Add this to your child theme’s functions.php file

// Make sure featured images are enabled
add_theme_support( 'post-thumbnails' );

// Add other useful image sizes for use through Add Media 
add_image_size( 'dw-medium', 480, 480 );
add_image_size( 'dw-bigger', 680, 680 );

// Register and name the image sizes for use in add Media modal
add_filter( 'image_size_names_choose', 'dw_custom_sizes' );
function dw_custom_sizes( $sizes ) {
 return array_merge( $sizes, array( 
 'dw-medium' => __( 'Product Archive 480' ),
 'dw-bigger' => __( 'Product Single 680' ),
 ) );
}

5.  Automatic Optimization (the real game changer)

For a long time fired up Adobe Fireworks to optimize my images.  I would use a free plugin like EWWW image optimizer  but that was mainly for clients.

Then there was a AppSumo deal on ShortPixel (aff. link) and everything changed. No more optimizing beforehand.  There was no point anything, I did would further reduced (on average 30- 60%).  I really like  ShortPixel. I have tried a few others and I think this has come the closest to getting the maximum reduction without over optimizing and spoiling some images.

 

What methods or plugins do you use in your image workflow?

Posted in

Please share this post:

DWcircle

I build websites at WP Corner Shop and travel. I also co-host a weekly WordPress podcast called WP Builds and make YouTube videos.

Leave a Comment





Do NOT follow this link or you will be banned from the site!