Expand small images in index. Upscale!.

Hi,
I have different sizes of images in the index, there are a lot of modules with similar image sizes.
I need a custom CSS for fill the FIG when the image is smaller than the contenedor.
Because, (for optimization purpose), i think is better use similar modules (in image size) and it is not necessary generate so many resize.

how i can “fill… expand.. upscale” the same image with CSS???

Thanks

Hi, the best way for Google speed is actually to have actual thumbs for each size, and use the regenerate thumbnails plugin to build for all the sizes. Otherwise you end up with images being “resized” and masked by the web browser, and loading larger images in each spot, which impacts over page load time by loading larger images.

I use the free “thumbnail upscale” plugin and then the regenerate thumbnails plugin at it makes all the right sizes to “fill” each spot.

If that was not what you were asking about, pardon the reply here. 🙂

Hi Chris, Yes!! Your solution is that i am looking for. Thanks.
I have a little trouble with the image regeneration. Could you help me?.

The sizes that i am using in the index are:
Block 4 = 250 X 160
Block 16 = 218 X 150
Block 1 = 100 X 70 and 324 X 235
Block 7 = 100 X 70
Block 14 = 356 X 220

Then, the first i do is:
1) in the setup MEDIA Thumbnail sizes i put the following:
Small : 100 x 70
Medium: 250 x 160
Big : 356 x 220

2) Then i run the “Regenerate Thumbnail plugin” and i could see this..

Debugging Information

Total Images: 67
Images Resized: 0
Resize Failures: 67

function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}

And the last line is repeated a lot of times.

The good thing is that when i go to see the index, all images are now with perfect size.

But, finally, i must edit a news, and when i press <Save> appear the “white windows of death”, with this errors:

Warning: imagecreatetruecolor(): Invalid image dimensions in /Applications/MAMP/htdocs/wordpress-clean-new6.5/wp-includes/media.php on line 2130

Warning: imagecopyresampled() expects parameter 1 to be resource, boolean given in /Applications/MAMP/htdocs/wordpress-clean-new6.5/wp-includes/class-wp-image-editor-gd.php on line 198

Warning: imagecreatetruecolor(): Invalid image dimensions in /Applications/MAMP/htdocs/wordpress-clean-new6.5/wp-includes/media.php on line 2130

Warning: imagecopyresampled() expects parameter 1 to be resource, boolean given in /Applications/MAMP/htdocs/wordpress-clean-new6.5/wp-includes/class-wp-image-editor-gd.php on line 198

Warning: imagecreatetruecolor(): Invalid image dimensions in /Applications/MAMP/htdocs/wordpress-clean-new6.5/wp-includes/media.php on line 2130

Warning: imagecopyresampled() expects parameter 1 to be resource, boolean given in /Applications/MAMP/htdocs/wordpress-clean-new6.5/wp-includes/class-wp-image-editor-gd.php on line 198

Warning: Cannot modify header information - headers already sent by (output started at /Applications/MAMP/htdocs/wordpress-clean-new6.5/wp-includes/media.php:2130) in /Applications/MAMP/htdocs/wordpress-clean-new6.5/wp-admin/post.php on line 242

Warning: Cannot modify header information - headers already sent by (output started at /Applications/MAMP/htdocs/wordpress-clean-new6.5/wp-includes/media.php:2130) in /Applications/MAMP/htdocs/wordpress-clean-new6.5/wp-includes/pluggable.php on line 1207

The first that i have checked is if the GD library is installed. But YES!.. It is in my phpinfo.!
Searching in google i saw that the thumbnail must be in certain size or the resize isn’t work.

how it work?. How i can setup my own sizes?.

Regards.