0

Lets say I accept guest post submissions. On the post archive page I have the image the user uploaded with the post on the left and an excerpt of the post on the right.

Unless I programmatically prevent the users from uploading images of various sizes and aspect ratios, they will certainly do so. But one doesn't want all sorts of different image sizes appearing on the archive page, they should all be roughly the same size/aspect ratio.

In the case of different sizes but the same aspect ratio the solution isn't too difficult - simply choose the desired size and resize the image appropriately. In most cases this will work perfectly (sure there will be outliers).

But what about in the case of different aspect ratios? Here things become much more difficult. Do we force the user to crop their image to an aspect ratio? If so, how? Do we auto crop the image to the desired aspect ratio? Or do we simply contort the image to the desired dimensions without concern for aspect?

Would love to hear how folks are solving this programmatically or through plugins.

  • downvoted as this is an invitation for discussion, and not an actual question which can have an authoritative answer. In addition I am not sure how is it wordpress specific as this sounds like an issue common to all platforms in which users may upload images – Mark Kaplun Aug 21 '18 at 19:02
  • @MarkKaplun - When asking a question, the How to Ask window says, "We prefer questions that can be answered, not just discussed." So if this is a discussion rather than a question, it doesn't seem to be outside the scope of this StackExchange, simply not the ideal type. I would suggest, however, that this is an actual question as mayersdesign provides an actual answer to the question, not simply points for discussion. I understand that this problem is not WP specific, but there are WP specific ways of handling problems, so asking on a general dev stack exchange while providing answers – davemackey Aug 21 '18 at 23:57
  • would not necessarily provide useful answers, so, imho, this is particularly a WP question. :) – davemackey Aug 22 '18 at 0:00
1

You are right when you predict you will be at the mercy of the uploaders, and they can be very inventive when it comes to sizing and aspect ratio!

My approach is to be very verbose in the front-end UI as to what images are acceptable - "Please upload standard ratio images for example 1200x900, or 800x600. Please note your images will be cropped to this ratio so failure to...." (etc)

If they ignore that, then their images still hit my functions file where I unset the standard WP image sizes, and set my own. A lot of them HARD crop, so it's uploader beware I'm afraid (I left a couple of bonus functions at the end here too):

//Remove all the defaults

function remove_default_image_sizes( $sizes ) {

 //Default WordPress
 unset( $sizes[ 'thumbnail' ] );
 unset( $sizes[ 'medium' ] );
 unset( $sizes[ 'medium_large' ] );
 unset( $sizes[ 'large' ] );

 //With WooCommerce you can remove these too
 //unset( $sizes[ 'shop_thumbnail' ]); // Shop thumbnail (180 x 180 hard cropped)
 //unset( $sizes[ 'shop_catalog' ]); // Shop catalog (300 x 300 hard cropped) 
 //unset( $sizes[ 'shop_single' ]); // Shop single (600 x 600 hard cropped)

 return $sizes;
}
add_filter( 'intermediate_image_sizes_advanced','remove_default_image_sizes' );

//Add our new sizes, xome hard cropped...

add_image_size( 'custom-large', 1200, 900, false);
add_image_size( 'custom-medium', 800, 600, false);
add_image_size( 'custom-thumb', 260, 195, false);
add_image_size( 'custom-blog-cropped', 1200, 500, true );
add_image_size( 'custom-avatar-cropped', 110, 110, true );

//Bonus functions

// Disable WordPress responsive srcset images
add_filter( 'max_srcset_image_width', create_function( '', 'return 1;' ) );

//Remove the hardcoded width and height WP loves setting
function remove_img_attr( $html ) {
 return preg_replace( '/(width|height)="\d+"\s/', "", $html );
}
add_filter( 'post_thumbnail_html', 'remove_img_attr' );
  • No problem, you can mark the answer correct if it helped you ;) – mayersdesign Aug 22 '18 at 8:42

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.