Beiträge

Nextgen Gallery – Resizing images according to the aspect ratio

Soooo… after postponing it for quite a while… I sat down and solved finally the aspect ratio problem when Nextgen Gallery shall resize/shrink an image.

The problem is… If I set as picture size e.g. 800×600 px (width x height), then Nextgen Gallery resizes a picture from e.g. 1024x768px to this format. All good. But if the original picture is 768x1024px then the result is not a picture with 600x800px, no, it will be a picture of 450x600px. And that is not what we want. (Isn’t it?)

So, I sat down today and checked the sources. Actually its simple. The picture will be uploaded and checked on its size. The values will be re-calculated be the settings and the aspect ratio should be checked as well. They just forgot to adjust the settings. We’ll do that now…

Open the file „/wp-content/plugins/nextgen-gallery/admin/wp25/functions.php“ in an editor and search for the function „function resizeImages()“. Here you’ll see:

function resizeImages($gallery_absfolder, $pictures) {
// ** $gallery_absfolder must contain abspath !!

if(! class_exists(’ngg_Thumbnail‘))
require_once(NGGALLERY_ABSPATH.’/lib/thumbnail.inc.php‘);

$ngg_options = get_option(’ngg_options‘);

if (is_array($pictures)) {

$bar = new wpProgressBar(__(‚Running… Please wait‘,’nggallery‘));
$bar->setHeader(__(‚Resize images‘,’nggallery‘));
//total number of elements to process
$elements = count($pictures);
// wait a little bit after finished
if ($elements > 5) $bar->setSleepOnFinish(2);
//print the empty bar
$bar->initialize($elements);

foreach($pictures as $picture) {

if (!is_writable($gallery_absfolder.“/“.$picture)) {
$messagetext .= $gallery_absfolder.“/“.$picture.“<br />“;
$bar->increase();
continue;
}

$thumb = new ngg_Thumbnail($gallery_absfolder.“/“.$picture, TRUE);
// echo $thumb->errmsg;
// skip if file is not there
if (!$thumb->error) {
$thumb->resize($ngg_options[‚imgWidth‘],$ngg_options[‚imgHeight‘], $ngg_options[‚imgResampleMode‘]);
if ( $thumb->save($gallery_absfolder.“/“.$picture,$ngg_options[‚imgQuality‘]) ) {
// do not flush the buffer with useless messages
if ($elements < 100)
$bar->addNote($picture. __(‚ : Image resized…‘,’nggallery‘));
} else
$bar->addNote($picture . “ : Error : <strong>“.$thumb->errmsg.“</strong>“);
$bar->increase();
}
$thumb->destruct();
}
}

if(!empty($messagetext)) nggallery::show_error(‚<strong>‘.__(‚Some pictures are not writeable :‘,’nggallery‘).'</strong><br /><ul>‘.$messagetext.'</ul>‘);
return;
}

This is the function which resizes our original pictures. We’ll replace this function now with this modified one:

function resizeImages($gallery_absfolder, $pictures) {
// ** $gallery_absfolder must contain abspath !!

if(! class_exists(’ngg_Thumbnail‘))
require_once(NGGALLERY_ABSPATH.’/lib/thumbnail.inc.php‘);

$ngg_options = get_option(’ngg_options‘);

if (is_array($pictures)) {

$bar = new wpProgressBar(__(‚Running… Please wait‘,’nggallery‘));
$bar->setHeader(__(‚Resize images‘,’nggallery‘));
//total number of elements to process
$elements = count($pictures);
// wait a little bit after finished
if ($elements > 5) $bar->setSleepOnFinish(2);
//print the empty bar
$bar->initialize($elements);

foreach($pictures as $picture) {

if (!is_writable($gallery_absfolder.“/“.$picture)) {
$messagetext .= $gallery_absfolder.“/“.$picture.“<br />“;
$bar->increase();
continue;
}

$thumb = new ngg_Thumbnail($gallery_absfolder.“/“.$picture, TRUE);
// echo $thumb->errmsg;
// skip if file is not there

if (!$thumb->error) {
//$thumb->resize($ngg_options[‚imgWidth‘], $ngg_options[‚imgHeight‘], $ngg_options[‚imgResampleMode‘]);

if ($thumb->currentDimensions[‚height‘] > $ngg_options[‚imgHeight‘] || $thumb->currentDimensions[‚width‘] > $ngg_options[‚imgWidth‘]) {

// check for portrait format
if ($thumb->currentDimensions[‚height‘] > $thumb->currentDimensions[‚width‘]) {
//vorgaben checken
if ($ngg_options[‚imgWidth‘] > $ngg_options[‚imgHeight‘]) {
$y = $ngg_options[‚imgWidth‘];
$x = $ngg_options[‚imgHeight‘];
} else {
$y = $ngg_options[‚imgHeight‘];
$x = $ngg_options[‚imgWidth‘];
}
$thumb->resize($x, 0, $ngg_options[‚imgResampleMode‘]);
// get optimal y startpos
$ypos = ($thumb->currentDimensions[‚height‘] – $y) / 2;
$thumb->crop(0, $ypos, $x,$y,$ngg_options[‚imgResampleMode‘]);
} else {
//vorgaben checken
if ($ngg_options[‚imgWidth‘] < $ngg_options[‚imgHeight‘]) {
$y = $ngg_options[‚imgWidth‘];
$x = $ngg_options[‚imgHeight‘];
} else {
$y = $ngg_options[‚imgHeight‘];
$x = $ngg_options[‚imgWidth‘];
}
$thumb->resize(0,$y,$ngg_options[‚imgResampleMode‘]);
// get optimal x startpos
$xpos = ($thumb->currentDimensions[‚width‘] – $x) / 2;
$thumb->crop($xpos, 0, $x,$y,$ngg_options[‚imgResampleMode‘]);
}

} else {
$thumb->resize($ngg_options[‚imgWidth‘], $ngg_options[‚imgHeight‘], $ngg_options[‚imgResampleMode‘]);
}

if ( $thumb->save($gallery_absfolder.“/“.$picture,$ngg_options[‚imgQuality‘]) ) {
// do not flush the buffer with useless messages
if ($elements < 100)
$bar->addNote($picture. __(‚ : Image resized…‘,’nggallery‘));
} else
$bar->addNote($picture . “ : Error : <strong>“.$thumb->errmsg.“</strong>“);
$bar->increase();
}
$thumb->destruct();
}
}

if(!empty($messagetext)) nggallery::show_error(‚<strong>‘.__(‚Some pictures are not writeable :‘,’nggallery‘).'</strong><br /><ul>‘.$messagetext.'</ul>‘);
return;
}

Ok, what is this doing now?

if ($thumb->currentDimensions[‚height‘] > $ngg_options[‚imgHeight‘] || $thumb->currentDimensions[‚width‘] > $ngg_options[‚imgWidth‘]) {

First of all we check if the uploaded image is bigger then the settings. If not, then we don’t need to do anything anyway.

if ($thumb->currentDimensions[‚height‘] > $thumb->currentDimensions[‚width‘])

Here we check the aspect ratio… horizontal or vertical format.

if ($ngg_options[‚imgWidth‘] > $ngg_options[‚imgHeight‘]) {
$y = $ngg_options[‚imgWidth‘];
$x = $ngg_options[‚imgHeight‘];
} else {
$y = $ngg_options[‚imgHeight‘];
$x = $ngg_options[‚imgWidth‘];
}

And that is basically the new thing… after we know if we have a horizontal or vertical picture, we can adjust the setting values… like 800x600px or 600x800px (for my example).

And thats it already. Looks a lot, but its more explaining then anything else :)
Maybe that is not the best solution (especially it is not ‚update save‘), but it works for now. If you know a better solution, then let me have it in the comments. ;)

Please notice that all code snippets and examples on this page are on your own risk. I am not responsible for anything you do!

Cheers
Gordon

Image resize problem with the NextGEN Gallery plugin

Hi,

and I had a problem again. If you use WordPress with the „NextGEN Gallery“ plugin, then you may also stumble over this problem after some time.
In the options of the plugin you can set a picture size to shrink the pictures, in case they are to big.
I’ve added there the value of 640 x 480 px. Because to big pictures need too long to load and use unnecessarily much disk space. A few minutes ago I was wondering why the pictures still need ages to load and in the full screen mode I saw it … the pictures haven’t been resized by the plugin.

After a while consulting Google I found help.

Edit the file „/wp-content/plugins/nextgen-gallery/admin/wp25/functions.php“ and search the function „function upload_images()„. Scroll to the end of this function and search for:

//create thumbnails
nggAdmin::generatethumbnail(WINABSPATH.$gallerypath,$imageslist);

Write before this:

//create resized pictures
nggAdmin::resizeImages(WINABSPATH.$gallerypath,$imageslist);

Save it, upload the file to the web-space again and then it should work.

Source: http://wordpress.org/support/topic/177782

But something is still disturbing me. Wenn I set as size 640 x 480px then is it horizontal format. But the function doesn’t automatically recognize vertical format. I mean it recognize it of course… but the height is still 480px and the width will be calculated by the height. Like this the resulting image is a bit small then. Would be nice if the function would change the values according to the format of the picture.
Maybe I will check it next week. Then I’ll have more time. :)

[UPDATE] The article is ready, the problem is solved: To the article

Cheers
Gordon