Wordpress: get resized URL of the custom-cropped thumbnail - wordpress

I would like to display the manually-cropped thumbnail in the blog archive page. If I use this code, the original image is scaled and resized and not the manually cropped/sized thumbnail, which in my case chops off the head of the person in the picture:
//functions.php
add_image_size( 'archive-thumbnail', 220, 150, true );
set_post_thumbnail_size( 220, 150 );
//archive.php
get_the_post_thumbnail( get_the_ID(),'archive-thumbnail');
If I use the_post_thumbnail(array(220,150)); , I get 150px high "square-ish" image scaled down, again, based on the original image and not the manually-cropped thumbnail.
The closest to what I want is this:
$url=wp_get_attachment_thumb_url(get_post_thumbnail_id(get_the_ID()));
I get the manually cropped image, but it is scaled incorrectly - it is 150px wide and not tall.
So my question: how do I get the scaled URL of the manually cropped media thumbnail?

You want to use wp_get_attachment_image_src() to get the resized image - the functionwp_get_attachment_thumb_url() is a shortcut to get the thumbnail size.
$post_id = get_the_ID();
$thumb_id = get_post_thumbnail_id( $post_id );
$img_src = wp_get_attachment_image_src( $thumb_id, 'archive-thumbnail' );

If you edit code related to thumbnails after thumbnails have already been created, you need to regenerate them. Try using the Regenerate Thumbnails plugin.

Related

Add image size option

In my theme's functions.php I've added this:
function imagething () {
add_theme_support( 'post-thumbnails' );
add_image_size( 'new-custom-size', 1000, 500 );
}
add_action( 'after_setup_theme', 'imagething' );
However, when I go to media, and upload a file, I can't select the new image format.
For make the the size created with add_image_size available in the media uploader select, you need to use the filter image_size_names_choose and add your custom created size to the list of available dimensions, like this:
add_filter( 'image_size_names_choose', 'so46754923_image_size_names_choose' );
function so46754923_image_size_names_choose( $sizes ) {
return array_merge( $sizes, array(
'new-custom-size' => __( 'New Custom Size Name' ),
) );
}
Image size not showing right in the image uploader select
In case the size you chose isn't showing right in the Image Uploader Select, it may be for 2 reasons:
Content_Width set for your theme
add_image_size() crop parameter is set to false, in this case, the uploaded image may not be in the desired size.
Content width defines width for your content (images, oembed, etc...)
Example: Suppose you are using twenty seventeen theme and added a image size like you said
add_image_size( 'new-custom-size', 1000, 500, true ); //in my example I've used crop true, so the image can really be 1000 x 500, in case you don't understand about crop you have to make a research about it.
In the Twenty Seventeen the content_width is set for 525
$GLOBALS['content_width'] = 525;
And the you added the code I provided above ( so46754923_image_size_names_choose() )
You will see New Custom Size - 525 x 263
If you comment the line
$GLOBALS['content_width'] = 525;
You will see New Custom Size - 1000 x 500

Wordpress fallback thumbnail size

I have just imported about 1000 posts from an old wordpress site into a new one. The new theme requires images that are larger than the previous one, and to conform to a certain aspect ratio (4:3).
I have set up a custom image size:
add_image_size( 'blog_thumbnail', 640, 480, true);
which works, but as most of the images from the previous site were smaller than this, they are not being cropped, which is a problem because they are not all 4:3 (in fact they used about 20 different ratios).
So I've set up a fallback image size which will cover all the images:
add_image_size( 'blog_thumbnail_mini', 300, 225, true);
But I can't think of a way of setting this as a fallback other than including both and hiding the fallback with CSS if the larger is present, which seems like a sub-optimal solution.
I'm using pretty standard code to embed the image:
$thumb = wp_get_attachment_image( get_post_thumbnail_id($post['ID']), 'blog_thumbnail' );
You can try https://wordpress.org/plugins/regenerate-thumbnails/ which will regenerate your new thumbnail size 640, 480 from the original full size image.
But how well that works depends on if the full size images still exist - you can usually spot them in /uploads/ as an image with the title and no sizing, or in the media library - and if full size images are of sufficient size and quality to allow resizing.
Edit 10/20/16
You can try checking the minimum width of the current thumbnail and either using that or falling back to another thumbnail size:
if ( has_post_thumbnail() ) {
$imgdata = wp_get_attachment_image_src( get_post_thumbnail_id(), 'current_blog_thumbnail' );
$imgwidth = $imgdata[1];
$minimum_width = 300; //change this minimum width to what you need
if ( ($imgwidth < $minimum_width ) ) {
the_post_thumbnail('current_blog_thumbnail');
} else {
the_post_thumbnail('fallback_blog_thumbnail');
}
}

picture cut offs in Wordpress/ not being fit

As you can see in the picture, when I upload my product images to WordPress the head of models cut off and I cannot see the full image in thumbnails. Does anyone have any solution for this issue ?
you can set thumnails without crop , just add custom thumnail in function.php and use it , like this :
in function.php ::
add_action( 'after_setup_theme', 'wpdocs_theme_setup' );
function wpdocs_theme_setup() {
add_image_size( 'my-thumb', 50 ); // 50 pixels wide by 50 pixels tall, resize mode (whitout croped)
}

Wordpress Jetpack Tiled Gallery loading full size images then resizing them down to thumbnails

I am using a Jetpack Tiled gallery as a widget for my site. It was taking forever to load.
I realized that the thumbnails were actually loading the full size images and then sizing them down to small thumbnails. The originals are very large, so that is why it was taking so long.
I noticed that in all of the jetpack gallery examples online the source of the image looked like this:
http://example.com/wp-content/uploads/2013/10/test.jpg?w=83&h=110
When I go to the URL for those examples, the image is resized correctly. However, those parameters do not work on my site and the full size image is loaded instead.
Is there any way to solve this?
I noticed this behaviour today as well, took some heavy galleries to notice that it was actually serving my high res images for the gallery. I made a quick fix that uses the different image versions that are available.
It's a quick'n'dirty fix, it should really check all registered image sized with
get_intermediate_image_sizes() and sort on sizes and return the proper URL.
Well well...This fix will save me bandwidth and load times..
I patched the rectangular_talavera. in plugins/slimjetpack/modules/tiled-gallery/tiled-gallery.php
$size = 'large';
if ( $image->width <= 150 ) {
$size = 'thumbnail';
} elseif ( $image->width <= 590 ) {
$size = 'medium';
}
$image_title = $image->post_title;
//$orig_file = wp_get_attachment_url( $image->ID );
$image_attributes = wp_get_attachment_image_src( $image->ID, $size ); // returns an array
$orig_file= $image_attributes[0];

wordpress add new thumbnail size of image

wordpress admin has 3 default image sizes i.e thumbnail,medium,large.How can i add one more type (ex:700px X 500px)so that if i upload an image it also saves in all four sizes.
Thanks in advance.
Add the following to your functions.php file.
add_image_size( 'name-of-size', 700, 500, true );
More information can be found here.
**Also note that you will need to regenerate thumbnails for those images which were previously uploaded, if you need them in the new size.
add_image_size( 'new-thumb', 110,100,true);
syntax ==> <?php add_image_size( $name, $width, $height, $crop ); ?>
Refer Here Add Image Size

Resources