Keyword

Resize thumbnail images automatically?

  • Ante Oja
  • Ante Oja's Avatar Topic Author
  • Offline
  • New Member
More
13 years 5 months ago #95560 by Ante Oja
Resize thumbnail images automatically? was created by Ante Oja
Hello K2 members!

The thumbnail image on my items on my website is set to 157x157

So for example, If I add a image thats 1000x1000 to an item, it resizes to 157x157.

But if I ad a image thats 100x200 it only resizes to 100x157.

 

I want all my thumbnails image to be 157x157

I'll show with 2 pictures



 

 

 

 

 

 

It looks like this at the moment. Under the item "KaitarN - Det bästa" you can se that the image doesnt resizes to 157x157 as the other images are.

 

 

 

 

 

 



 

 

 

 

 

 

I want it to look something like this. So the thumbnail image resizes automatically to 157x157

 

 

 

 

 

 

 

 

 

 

 

Thanks in advance!

Please Log in or Create an account to join the conversation.

More
13 years 5 months ago #95561 by Tafadzwa Makura
Replied by Tafadzwa Makura on topic Resize thumbnail images automatically?
I imagine K2 achieves the thumb nails by giving an image a fixed width of say 157 pixels and giving the height an auto value so that it adjusts proportionately according to the  aspect ratio of the image which makes sense since you can't change an image aspect ratio without either cropping it or stretching it. If an original image is WIDER than it is high it it will not be as wide as it is high when you make it a 157px by 157px thumbnail it will maintain it's Aspect ratio.

 

I can imagine 2 work arounds for this.

 

1.) Edit the original image so that  it has a Square aspect ratio (Width=Height) or (Height>Width). All album covers by default have a square aspect ratio so it shouldn't be too difficult for you. 

 

2.) You can automatically crop your thumbnails so that if it they are wider than they are high they will be cropped automatically so that they will fill the 150px by 150px space available.

If you want to use this method you can tell me so that I can post the Css you need to integrate in your template categoryItem.php!

Please Log in or Create an account to join the conversation.

More
13 years 5 months ago #95562 by Tafadzwa Makura
Replied by Tafadzwa Makura on topic Resize thumbnail images automatically?
If you don't mind stretching the thumbnail (which you should) you could force the height to be the same as the width by replacing the auto height with an actual width! That would work like your example! It is a very bad design practice however, to stretch an image beyond its default aspectratio like you example illustrates!

Please Log in or Create an account to join the conversation.

  • Ante Oja
  • Ante Oja's Avatar Topic Author
  • Offline
  • New Member
More
13 years 5 months ago #95563 by Ante Oja
Replied by Ante Oja on topic Resize thumbnail images automatically?
How could I force the height to be the same as the width by replacing the auto height with an actual width?

Thanks in advance!

Please Log in or Create an account to join the conversation.

More
13 years 5 months ago #95564 by Tafadzwa Makura
Replied by Tafadzwa Makura on topic Resize thumbnail images automatically?
Yes, I don't have the categoryItem.PHP file with me so I can't recall exactly the line or command that changes that attribute. What I know is inside the image block div tag is  an HTML tag that has a width attribute that receives its value from the parameters and a height value set to auto, change that auto value to a fixed height or copy the <?php> code that controls the width to also control the height from the same parameter value.

Make sense?   

 

Remember though that this will STRETCH your image, it won't crop it!

Please Log in or Create an account to join the conversation.

  • Ante Oja
  • Ante Oja's Avatar Topic Author
  • Offline
  • New Member
More
13 years 5 months ago #95565 by Ante Oja
Replied by Ante Oja on topic Resize thumbnail images automatically?
I did found: <img src="<?php echo $this->item->image; ?>" alt="<?php if(!empty($this->item->image_caption)) echo $this->item->image_caption; else echo $this->item->title; ?>" style="width:<?php echo $this->item->imageWidth; ?>px; height:auto;" />

If the image is WIDER than it is high I want the image to get as a square for example 157x157. How do I then change the code?

Thanks in advance!

Please Log in or Create an account to join the conversation.

More
13 years 5 months ago #95566 by BBC
Replied by BBC on topic Resize thumbnail images automatically?
Boobs are not big enough. :)

 

Search forum for "image hack".

Please Log in or Create an account to join the conversation.


Powered by Kunena Forum