Photo gallery in CMS Builder
6 posts by 3 authors in: Forums > CMS Builder
Last Post: April 21, 2009 (RSS)
A couple of photo gallery questions:
1. Is it possible to build a gallery in CMS Builder that will function like this? http://trafalgars.com/gallery.html. i.e. click on a thumbnail and the larger version appears in a popup?
2. Can CMS Builder create square thumbnails, rather than just smaller versions of the full-sized image?
Thanks!
1. Is it possible to build a gallery in CMS Builder that will function like this? http://trafalgars.com/gallery.html. i.e. click on a thumbnail and the larger version appears in a popup?
2. Can CMS Builder create square thumbnails, rather than just smaller versions of the full-sized image?
Thanks!
Nigel Gordijk
Common Sense Design: User-focused Web design
Tel: 001 519 342 5348 | Web: www.commonsensedesign.net
Common Sense Design: User-focused Web design
Tel: 001 519 342 5348 | Web: www.commonsensedesign.net
Re: [NigelGordijk] Photo gallery in CMS Builder
By Dave - December 31, 2008
Hi Nigel,
1. Yes, it can be done all with just HTML tags. That page (and our own CMS Builder product page) use this library: http://huddletogether.com/projects/lightbox2/
2. No, it's not possible right now without custom programming (email me if you want to discuss that). We've had a previous request for it though and will likely revisit it in the next few versions. There's some issues around how to align the crop and things like that to sort out.
Hope that helps, let me know if you need anything else.
1. Yes, it can be done all with just HTML tags. That page (and our own CMS Builder product page) use this library: http://huddletogether.com/projects/lightbox2/
2. No, it's not possible right now without custom programming (email me if you want to discuss that). We've had a previous request for it though and will likely revisit it in the next few versions. There's some issues around how to align the crop and things like that to sort out.
Hope that helps, let me know if you need anything else.
Dave Edis - Senior Developer
interactivetools.com
interactivetools.com
Re: [Dave] Photo gallery in CMS Builder
Thanks for the help, Dave.
Nigel Gordijk
Common Sense Design: User-focused Web design
Tel: 001 519 342 5348 | Web: www.commonsensedesign.net
Common Sense Design: User-focused Web design
Tel: 001 519 342 5348 | Web: www.commonsensedesign.net
Re: [NigelGordijk] Photo gallery in CMS Builder
By InHouse - April 20, 2009
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.
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.
Re: [InHouse] Photo gallery in CMS Builder
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.
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.
Nigel Gordijk
Common Sense Design: User-focused Web design
Tel: 001 519 342 5348 | Web: www.commonsensedesign.net
Common Sense Design: User-focused Web design
Tel: 001 519 342 5348 | Web: www.commonsensedesign.net
Re: [NigelGordijk] Photo gallery in CMS Builder
By InHouse - April 21, 2009
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.
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.