Does Avatars Optimize Uploaded Images?

Hello,

The Avatars plugin is not listed (why is that?) so I selected the Members Directory plugin because it uses the images of the Avatars plugin as does the Blogs Directory plugin.

If a user gets a new zillion pixel camera and decides to upload a HUMONGOUS image as their avatar, does Avatars limit the uploaded image size or create a more reasonable sized image for use as an avatar?

If not, that seems like a prudent feature to add.

If not, how would you suggest we go about minimizing and optimizing all Avatar images so they are the correct dimensions and an appropriately small file size for their intended use?

I ask because it seems we have a user with a HUGE PNG avatar file that is slowing down the whole site's responsiveness.

Thanks.

Phil D

    Tyler Postle

    Hey Phil D,

    Hope you're doing well today!

    Ah, the zillion pixel camera... hated by web servers everywhere :p

    You should be able to limit the max file upload in your Network Admin dashboard > Settings > Settings, Scroll down to the bottom and there will be options for upload file size. I've attached a screenshot to illustrate. Let us know if this does the trick

    All the best,
    Tyler

    SooBahkDo

    Hi Tyler,

    I am familiar with that setting, but it does not address the issue when a site may need to allow much larger files such as photography sites, and other image heavy sites that may need to upload larger files, but they just do not need zillion pixel images displayed in Avatar locations.

    It seems that one prudent solution would be for the Avatar plugin to assure that any image uploaded by the Avatar plugin is resized and shrunk to an appropriate size for use as an Avatar.

    That feature would assure that a zillion pixel Avatar image could not negatively impact page load and SEO scores because of needlessly large avatar files.

    With respect to dealing with users and their zillion pixel camera images in general, one solution that works like a charm for us to constrain the max dimensions of uploaded files is the plugin Imsanity.

    https://wordpress.org/plugins/imsanity/

    It allows you to set max dimensions (in addition to the existing WP file size limit you referred to). When a user uploads a zillion pixel by zillion pixel image it will automatically resize it to the the max dimensions specified. For example we have some photography heavy sites that use 1600x1600 images and Imsanity perfectly resizes 4000x4000 images uploads to 1600x1600 during upload.

    Imsanity works great for us on over 50 sites when activated site-by-site.

    We experienced some image upload failures when it was network activated.

    Unfortunately this solution still does not specifically restrict the size of Avatar images to more reasonable dimensions for use as Avatars like 35x35 or 50x50, etc.

    It seems prudent for the Avatars plugin to provide a means to enforce its own image sizing for images that will be used in Avatar locations.

    If the Avatars plugin did the same thing that Imsanity does which is allow the site admin to set the max dimensions of user uploaded avatar images and then automatically resizes larger images and shrinks them down to the max image size in settings, then site admins would have assurance that users could not bog down their whole Member Directory or Blog Directory and/or negatively impact the page load time on other parts of their site because users uploaded HUGE images as avatars.

    Sooooooooooooooooo I am lobbying that an optional functionality similar to Imsanity be added to the Avatars plugin to make it zillion pixel avatar image proof and to make it site admin friendly because the plugin would then assure that images uploaded for the purpose of being an avatar will always be appropriately sized and thus protect site owners' storage space, page load times and SEO scores that can be degraded by huge images in avatar display locations.

    However, I have not had much luck with my lobbying efforts for new features on WPMUDEV sooooooo the closing query is....

    Can you provide a plugin or code snippet that could be used to bulk resize only the Avatar plugin images that already exist on a site?

    That solution would help me avoid having to manually revisit every site and individually resize Avatar images to appropriate dimensions and file sizes for use as an Avatar.

    The plugin Force Regenerate Thumbnails works well for all thumbnail images, but an Avatar image is not a thumbnail. (Is it?)

    https://wordpress.org/plugins/force-regenerate-thumbnails/

    And the plugin Simple Image Sizes works great to generate additional special size thumbnail images, but Avatar images are not thumbnails. (Are they?).

    https://wordpress.org/plugins/simple-image-sizes/

    This seems to be one of those situations where I just can't get there from here.

    The necessary tools and code all seem to be available but not connected to Avatar specific images so I need a way to apply changes to only the Avatars plugin images.

    Perhaps a snippet of code or a special plugin setting/or query to retrieve only Avatar images that can then be piped thru one of these other plugins for bulk shrinking, resizing and SEO optimizing??

    Ideas, code snippets, plugin suggestion?

    Thanks,
    Phil D

    Hoang Ngo

    Hi @SooBahkDo,

    I hope you are well today

    Here is a quick script for resize all the images in the avatar folder. Before you try this, please backup all your upload images first.

    Please add this code to your theme functions.php or use mu-plugins

    add_action( 'wp_footer', 'resize_image_avatar' );
    function resize_image_avatar() {
    	global $ms_avatar;
    
    	$avatar_dir = $ms_avatar->blog_avatar_dir;
    	$max_width  = '1000';
    	$images     = directoryToArray( $avatar_dir, true );
    	foreach ( $images as $img ) {
    		$img_data = @getimagesize( $img );
    		if ( is_array( $img_data ) ) {
    			if ( array_shift( explode( '/', $img_data['mime'] ) ) == 'image' ) {
    				if($img_data[0] > $max_width){
    					//resize
    					$new_width = $max_width;
    					$ratio = $img_data[0]/$img_data[1];
    					$new_height = $new_width/$ratio;
    
    					$img_obj = new Imagick($img);
    					$img_obj->thumbnailImage($new_width , $new_height);
    					$img_obj->writeImage($img);
    				}
    			}
    		}
    	}
    }
    function directoryToArray( $directory, $recursive ) {
    	$array_items = array();
    	if ( $handle = opendir( $directory ) ) {
    		while ( false !== ( $file = readdir( $handle ) ) ) {
    			if ( $file != "." && $file != ".." ) {
    				if ( is_dir( $directory . "/" . $file ) ) {
    					if ( $recursive ) {
    						$array_items = array_merge( $array_items, directoryToArray( $directory . "/" . $file, $recursive ) );
    					}
    					$file          = $directory . "/" . $file;
    					$array_items[] = preg_replace( "/\/\//si", "/", $file );
    				} else {
    					$file          = $directory . "/" . $file;
    					$array_items[] = preg_replace( "/\/\//si", "/", $file );
    				}
    			}
    		}
    		closedir( $handle );
    	}
    
    	return $array_items;
    }

    Also, you can change the variable max_width to fit with your need.

    Please give it a try and let us update.

    Thanks.

    Best regards,
    Hoang

    SooBahkDo

    Hello Hoang,

    Thank you for your help.

    Before I proceed, please help me understand when and how this feature will work.

    I find five different images inside the folders

    uploads/avatars/blogs
    uploads/avatars/user

    Does the avatar plugin store the original size image and produce 4 additional size images for its use?

    It appears that all image sizes in these folders are smaller than a large original file size would be. ????

    Does the avatar plugin know to use the smallest size possible for the area in which an avatar is being displayed?

    If the avatar plugin code uses the smallest possible image from among the 5 in the folder, then perhaps I am trying to fix something that does not need fixing. ???????

    I assume the MU-plugin code would restrict the max size of the original uploaded avatar image and the avatar plugin would still generate the multiple sizes that I find in each folder. Is this correct?

    *******************************

    If I do proceed with this solution, I prefer to restrict the size of all avatar uploads on any site on the network so that no user can upload a HUGE avatar image file. (Rather than only restricting avatar size on a single site via a theme functions file)

    It seems I would need to implement this as an MU-plugin to accomplish that goal network wide for all avatars uploaded on any site. Is that correct?

    Depending on your response to my questions above, is this necessary?

    *******************************

    Tyler Postle

    Hey Phil D,

    Hope you're doing well today!

    Thanks for your patience here

    Does the avatar plugin store the original size image and produce 4 additional size images for its use?

    Yes it stores sizes for different situations.

    It appears that all image sizes in these folders are smaller than a large original file size would be. ????

    Depending on the size of the original upload it may have shrunk it. Did you check the original upload size?

    Does the avatar plugin know to use the smallest size possible for the area in which an avatar is being displayed?

    Yes, in some cases it still will need to scale down the image though, if it needs one that's inbetween sizes.

    It seems I would need to implement this as an MU-plugin to accomplish that goal network wide for all avatars uploaded on any site. Is that correct?

    Exactly

    Hope this helps! Let us know how the script works for you.

    All the best,
    Tyler

    Tyler Postle

    Hey there,

    Just checking in on past relevant threads to let you know we have just launched WP Smush Pro!

    It's an incredibly efficient image optimization tool for blazing fast load times

    You can try it out now: https://premium.wpmudev.org/project/wp-smush-pro/

    If you have any questions on it then please create a topic here: https://premium.wpmudev.org/forums/#question

    Have a great day!

    Cheers,
    Tyler