Displaying Search Result Thumbnails in Correct Aspect Ratio
highluxphoto Registered Users Posts: 9 Big grins
edited July 22, 2020 in SmugMug Customization
Does anybody have a code hack to force the thumbnails on the search results page to display in their correct aspect ratio (i.e. landscape & portrait) rather than the default of tightly packed square thumbnails? Or is there a setting I have missed?
You haven't missed any settings, but there is some simple CSS that will do the job. The basic code to get uncropped, original aspect-ratio images is real simple. Insert this in the custom CSS section on the Advanced tab of your theme.
The result doesn't look great to my eyes, so the code below has two tweaks to consider. This add a little extra margin around the images and make them a bit bigger. Regarding the latter, what SmugMug shows are cropped 200 x 200 portions of larger (but still fairly small) images. When using an uncropped image, you are effectively shrinking them. Expanding the space to 300 x 300 looks good to my eye if you like square blocks. Since many images are rectangular, 300 x 400 may be desirable too. I've shown the latter below. Best not to go larger than that. SmugMug uses 300 x 400 source images to support the search result display, so going larger would up-scale the images and give soft, vaguely out-of-focus-looking results. You can, of course, go smaller. Again, the code below should be inserted into the custom CSS section on the Advanced tab of your theme.
Just jumping in here to thank you both. This is something I've been meaning to figure out for years.
By the way... Because of some other cust's on my site, I also needed to adjust the background color for the expanded margins (there may be a better way, but this is working for me):