Photo gallery in CMS Builder

Thanks for the help, Dave.

Just stumbled on this issue and thought of an old trick that I used once that might help issue #2.

Use a transparent GIF in any square dimensions you wish as the actual image to be displayed. Put that image in a span or a div depending on your needs. Then use a style rule to set the background-image source to the thumbnail generated by CMSB. Set the vertical and horizontal positioning to 50% each and you should be able to get square thumbnails for your design.

Some limits apply regarding the minimum size of the thumbnails but you can control this in CMSB. It's not the most elegant solution but it should work. YMMV.

J.

Thanks for the suggestion, InHouse.

The problem is, none of the original photos are square to start with, so forcing a portrait or landscape image into a square will distort how it appears on the page.

Also, centring the picture won;t work either, because not all of the shots have the main interest in the middle; some are off to the left or right.

Hello Nigel,

Yes, I agree that the cropping is less than ideal. However, the issue of the images not being square is addressed by the procedure above.

The square portion is created by the transparent GIF image and perhaps it's parent DIV/SPAN. That's the actual graphic being displayed by the traditional IMG SRC="path/transp.gif" code. The photo is placed using the CSS background property and is "under" the GIF. The image and/or DIV are not forced to take on the dimensions of the background image but conform to the square GIF dimensions.

It could even be the old-fashioned trick of a 1X1 transparent GIF that is given new dimensions by the height and width properties.

The cropping situation could be dealt with (again, not ideally) by having the positioning values of the CSS entered in that record of the CMS. Two text fields with values between 0-100% representing the horizontal and vertical background positioning values for that image alone. You could default to 50% but adjust it as you wish to meet the needs of the particular image.

I would think that if you used CMSB to generate thumbnails at 150px on the longest axis, then set the transparent GIF to 75px with the thumbnail centered by default, it would display the majority of the image. You'd then still have the option to override the positioning defaults fairly easily in the CMS.

Not ideal by any means and only a suggestion to be sure. But I rather think it would work. It's triggered me to consider using it for an upcoming site project. If I get it working I'll post a prototype code snippet.

J.