I am looking for code that will allow me to set the WIDTH of my images and will auto configure the height.
What I want in to set books and CDs to 220px wide, but allow the books to expand the image box as needed, beyond the square height of 220px.
Example: books are 220 wide by 320 high, so the image box should expand to allow for the 320 height, but will always stay 220x220 for the cd images, as I would not want those to be 320x320 (too big).
As I am limited to only ONE choice for size of all product images, I would like to have some control beyond the square format.
I know the resizing code resides in the system/library/image.php file but I am so afraid of fouling it up. I haven't a clue.
Any ideas would be greatly appreciated. Thanks.
My genius friend tweaked the image resize code and it works! Yeah.
Locate the file -
system/library/image.php
Locate the function between lines 54 and 92 that deal with the resizing of the image...
and replace it with ...
NOTE:
// unused original code has been left in place, but commented out, in case you ever want to switch back, and just to show what's been changed.
What will happen is this:
When you set your image sizes in the Admin panel (System > Settings > Image tab), instead of tall images getting shrunk to fit into a square box, they will automatically expand to fit the width you have set for your products.
For example: you set your product thumbnails to be 225 x 225.
Book covers will appear 225 x (the height in proportion to the width)
and cd covers will still be 225 x 225.
Also the image will align to the top of the div .box instead of floating in the center of a tall box. For this reason, set all images to square proportions.
Anyway, this is what I wanted for my own cart. Some may want to keep all the products the same size, which is what the original code does very well, but I like them to be relative to one another.
Also, thanks to 'uksitebuilder' for helping me with the image background color. That's also commented.
Locate the file -
system/library/image.php
Locate the function between lines 54 and 92 that deal with the resizing of the image...
Code: Select all
public function resize($width = 0, $height = 0) {
if (!$this->info['width'] || !$this->info['height']) {
return;
}
$xpos = 0;
$ypos = 0;
$scale = min($width / $this->info['width'], $height / $this->info['height']);
if ($scale == 1) {
return;
}
$new_width = (int)($this->info['width'] * $scale);
$new_height = (int)($this->info['height'] * $scale);
$xpos = (int)(($width - $new_width) / 2);
$ypos = (int)(($height - $new_height) / 2);
$image_old = $this->image;
$this->image = imagecreatetruecolor($width, $height);
if (isset($this->info['mime']) && $this->info['mime'] == 'image/png') {
imagealphablending($this->image, false);
imagesavealpha($this->image, true);
$background = imagecolorallocatealpha($this->image, 255, 255, 255, 127);
imagecolortransparent($this->image, $background);
} else {
$background = imagecolorallocate($this->image, 255, 255, 255);
}
imagefilledrectangle($this->image, 0, 0, $width, $height, $background);
imagecopyresampled($this->image, $image_old, $xpos, $ypos, 0, 0, $new_width, $new_height, $this->info['width'], $this->info['height']);
imagedestroy($image_old);
$this->info['width'] = $width;
$this->info['height'] = $height;
}and replace it with ...
Code: Select all
public function resize($width = 0, $height = 0) {
if (!$this->info['width'] || !$this->info['height']) {
return;
}
$xpos = 0;
$ypos = 0;
//$scale = min($width / $this->info['width'], $height / $this->info['height']); //original code commented out
$scale = $width / $this->info['width']; // New code - width set in admin panel divided by original size of uploaded image.
if ($scale == 1) {
return;
}
$new_width = (int)($this->info['width'] * $scale);
$new_height = (int)($this->info['height'] * $scale);
// $xpos = (int)(($width - $new_width) / 2); //original code commented out
// $ypos = (int)(($height - $new_height) / 2); //original code commented out
$xpos = 0; // new code
$ypos = 0; // new code
$image_old = $this->image;
$this->image = imagecreatetruecolor($width, $new_height); // changed height to new_height
if (isset($this->info['mime']) && $this->info['mime'] == 'image/png') {
imagealphablending($this->image, false);
imagesavealpha($this->image, true);
$background = imagecolorallocatealpha($this->image, 255, 255, 255, 127);
imagecolortransparent($this->image, $background);
} else {
$background = imagecolorallocate($this->image, 1, 1, 1); // change 1, 1, 1, to 255, 255, 255 for a white background.
}
imagefilledrectangle($this->image, 0, 0, $new_width, $new_height, $background);
imagecopyresampled($this->image, $image_old, $xpos, $ypos, 0, 0, $new_width, $new_height, $this->info['width'], $this->info['height']);
imagedestroy($image_old);
$this->info['width'] = $width;
$this->info['height'] = $new_height; // changed height to new_height
}
// unused original code has been left in place, but commented out, in case you ever want to switch back, and just to show what's been changed.
What will happen is this:
When you set your image sizes in the Admin panel (System > Settings > Image tab), instead of tall images getting shrunk to fit into a square box, they will automatically expand to fit the width you have set for your products.
For example: you set your product thumbnails to be 225 x 225.
Book covers will appear 225 x (the height in proportion to the width)
and cd covers will still be 225 x 225.
Also the image will align to the top of the div .box instead of floating in the center of a tall box. For this reason, set all images to square proportions.
Anyway, this is what I wanted for my own cart. Some may want to keep all the products the same size, which is what the original code does very well, but I like them to be relative to one another.
Also, thanks to 'uksitebuilder' for helping me with the image background color. That's also commented.
To anyone interested, here's how to do it in 1.5.6.3:
In system/library/image.php search for:
Replace with:
If you want your images to expand horizontally rather than vertically replace this in the new code:
with:
In system/library/image.php search for:
Code: Select all
public function resize($width = 0, $height = 0, $default = '') {
if (!$this->info['width'] || !$this->info['height']) {
return;
}
$xpos = 0;
$ypos = 0;
$scale = 1;
$scale_w = $width / $this->info['width'];
$scale_h = $height / $this->info['height'];
if ($default == 'w') {
$scale = $scale_w;
} elseif ($default == 'h'){
$scale = $scale_h;
} else {
$scale = min($scale_w, $scale_h);
}
if ($scale == 1 && $scale_h == $scale_w && $this->info['mime'] != 'image/png') {
return;
}
$new_width = (int)($this->info['width'] * $scale);
$new_height = (int)($this->info['height'] * $scale);
$xpos = (int)(($width - $new_width) / 2);
$ypos = (int)(($height - $new_height) / 2);
$image_old = $this->image;
$this->image = imagecreatetruecolor($width, $height);
if (isset($this->info['mime']) && $this->info['mime'] == 'image/png') {
imagealphablending($this->image, false);
imagesavealpha($this->image, true);
$background = imagecolorallocatealpha($this->image, 255, 255, 255, 127);
imagecolortransparent($this->image, $background);
} else {
$background = imagecolorallocate($this->image, 255, 255, 255);
}
imagefilledrectangle($this->image, 0, 0, $width, $height, $background);
imagecopyresampled($this->image, $image_old, $xpos, $ypos, 0, 0, $new_width, $new_height, $this->info['width'], $this->info['height']);
imagedestroy($image_old);
$this->info['width'] = $width;
$this->info['height'] = $height;
}Code: Select all
public function resize($width = 0, $height = 0, $default = '') {
if (!$this->info['width'] || !$this->info['height']) {
return;
}
$xpos = 0;
$ypos = 0;
$scale = 1;
$scale_w = $width / $this->info['width'];
$scale_h = $height / $this->info['height'];
$scale = $scale_w;
if ($scale == 1 && $scale_h == $scale_w && $this->info['mime'] != 'image/png') {
return;
}
$new_width = (int)($this->info['width'] * $scale);
$new_height = (int)($this->info['height'] * $scale);
$xpos = 0;
$ypos = 0;
$image_old = $this->image;
$this->image = imagecreatetruecolor($new_width, $new_height);
if (isset($this->info['mime']) && $this->info['mime'] == 'image/png') {
imagealphablending($this->image, false);
imagesavealpha($this->image, true);
$background = imagecolorallocatealpha($this->image, 255, 255, 255, 127);
imagecolortransparent($this->image, $background);
} else {
$background = imagecolorallocate($this->image, 255, 255, 255);
}
imagefilledrectangle($this->image, 0, 0, $new_width, $new_height, $background);
imagecopyresampled($this->image, $image_old, $xpos, $ypos, 0, 0, $new_width, $new_height, $this->info['width'], $this->info['height']);
imagedestroy($image_old);
$this->info['width'] = $new_width;
$this->info['height'] = $new_height;
}Code: Select all
$scale_w = $width / $this->info['width'];
$scale_h = $height / $this->info['height'];
$scale = $scale_w;Code: Select all
$scale_w = $width / $this->info['width'];
$scale_h = $height / $this->info['height'];
$scale = $scale_h;Hello! Thank you for this super useful information! Sadly, does not work on Opencart 2.2.0.0
Anybody knows how to update the code?
Thanks!
Anybody knows how to update the code?
Thanks!
Who is online
Users browsing this forum: No registered users and 8 guests
