Topic: [TIP/HACK] Square thumbnails for Gallery (Read 9365 times)

Greg Hunt · « **on:** 10. July 2009, 16:16:53 »

Worked on a request to square the thumbnail images in the gallery and thought I'd share the solution.

This hack changes the way that Gallery resizes images for thumbnails (Scales to short edge rather than long) and then crops (using the CSS file) the images to show the top area for portrait and left side of the image for Landscape images.

You will need to add the following section to your CSS file.

Code: [Select]

div.gallerythumb {
 width: 80px;
 height: 80px;
 overflow: hidden;
}

Note:Modify Height and Width settings to meet your needs.

and replace the following file in your .../sobi2/components/com_sobi2/plugins/gallery directory .

[attachment=1] Unzip first!

Hope you find this useful.
Greg

sezerbjk · « **Reply #1 on:** 11. July 2009, 01:36:36 »

i dont want change my gallery.class file..can u give me the codes required to add..

Greg Hunt · « **Reply #2 on:** 11. July 2009, 04:30:56 »

Sorry no where near my computer right now. Probably easiest just to do a filke compare as they are minor changes.
One to add the div class to the thumbnails.
The other one is in the resize image function. It does both the images and the thumbnails so you need to expand it a little. Something along the lines of...
If ($thumb){
Original code just change the < to a >(or was it the other way around)
}Else{original code}

That's about it.
Can't remember the exact code and I'm only on a blackberry for the weekend.

Greg

karoshino · « **Reply #3 on:** 11. July 2009, 19:27:07 »

Great work!
This is exactly what i was looking for but couldn't find a few days ago.

Thank you very much.

k.

capeinfo · « **Reply #4 on:** 12. July 2009, 19:54:22 »

Excellent, excellent, excellent! What a difference that makes. Thank you!!!

Now wouldn't it be great if the order of the images could be changed by dragging, and if captions could be added after the images were uploaded ...

Greg Hunt · « **Reply #5 on:** 13. July 2009, 14:39:25 »

Oops.

Not quite perfect. Explorer doesn't display this quite right it creates a wide border on the Landscape images... Stupid MS.

Greg

capeinfo · « **Reply #6 on:** 13. July 2009, 14:56:49 »

Well IE must be getting there... it's fine in IE8

[attachment=1]

robiv8 · « **Reply #7 on:** 31. January 2010, 12:30:52 »

Hallo,
is this also possible to make for the vcards, i mean i wana have max-hight and max-width for an details-picture in the vcard.
Robi

Byberg · « **Reply #8 on:** 16. May 2010, 12:18:10 »

I have set the size for images in the V-card and the description says IF the image is smaller it will make it larger to fit the size I have chosen... but the images in v-card is still different for all images depending on the original size...

whats wrong?