n00b Questions About Using Concrete 5
Permalink
Hey All,
I'm new to the Concrete5 world... but I'm really liking what I see. I'd love to use it on a new client project I've got brewing, but I'm not sure if it's going to work for me or not. Here's what I'm looking to do:
Obviously, the reason I'm interested in C5 is because the site owner wants to be able to maintain the content for the site themselves. Great. C5 has got that in the bag! The only thing is that one of the items they MOST want to be able to maintain is an image gallery full of property photos (or, most likely, multiple image galleries... one for each property). They want it to be a lightbox-style gallery, very much like the one on this page: http://tinyurl.com/33mo7r9 <-- click on one of the thumbnails near the bottom to see the gallery.
So... I've seen that there are a bunch of C5 Add-Ons that add Gallery capabilities... but I'm trying to figure out how, exactly, they would work.
Typically, with a lot of the jQuery-powered lightbox clones, the images are coded right onto the page itself, but are hidden with CSS. So how would a user be able to add/edit photos into the individual galleries using the C5 editing tools if they are hidden from view? Could this even be done with InContext editing? Or does it need to be handled in the File Manager? Or am I missing something here? (wouldn't surprise me!)
Also... I'm assuming that this client doesn't know much about image editing, so it's quite likely that the photos are going to come directly off of their digital camera. What, if any, options are there for re-sizing the images as they are uploaded? No sense displaying a 3MB image (that's probably like 4,000px x 3,000px) if it only needs to be about 800px wide in the lightbox.
Sorry if these questions are pretty dumb! But I appreciate any help/direction anyone can give. I don't want to take on this project, only to discover somewhere later on that C5 can't do what I need and now I'm trapped! >:O
Thanks!
I'm new to the Concrete5 world... but I'm really liking what I see. I'd love to use it on a new client project I've got brewing, but I'm not sure if it's going to work for me or not. Here's what I'm looking to do:
Obviously, the reason I'm interested in C5 is because the site owner wants to be able to maintain the content for the site themselves. Great. C5 has got that in the bag! The only thing is that one of the items they MOST want to be able to maintain is an image gallery full of property photos (or, most likely, multiple image galleries... one for each property). They want it to be a lightbox-style gallery, very much like the one on this page: http://tinyurl.com/33mo7r9 <-- click on one of the thumbnails near the bottom to see the gallery.
So... I've seen that there are a bunch of C5 Add-Ons that add Gallery capabilities... but I'm trying to figure out how, exactly, they would work.
Typically, with a lot of the jQuery-powered lightbox clones, the images are coded right onto the page itself, but are hidden with CSS. So how would a user be able to add/edit photos into the individual galleries using the C5 editing tools if they are hidden from view? Could this even be done with InContext editing? Or does it need to be handled in the File Manager? Or am I missing something here? (wouldn't surprise me!)
Also... I'm assuming that this client doesn't know much about image editing, so it's quite likely that the photos are going to come directly off of their digital camera. What, if any, options are there for re-sizing the images as they are uploaded? No sense displaying a 3MB image (that's probably like 4,000px x 3,000px) if it only needs to be about 800px wide in the lightbox.
Sorry if these questions are pretty dumb! But I appreciate any help/direction anyone can give. I don't want to take on this project, only to discover somewhere later on that C5 can't do what I need and now I'm trapped! >:O
Thanks!
@Adreco,
Thanks for the fast response! PUG does indeed look like a cool Add-On... and it seems like it should be able to handle just about everything I need for the pop-up/lightbox gallery.
But the description on their website for the Image Galleries has me concerned about the size of the files the client may be uploading. Specifically:
Which would mean the client will have to re-size them to the desired size before uploading them. Something I'd rather not have to have them do (NOT entirely a deal-breaker, just a Nice-to-Have if the system could handle it for them).
I'll keep looking!
Thanks for the fast response! PUG does indeed look like a cool Add-On... and it seems like it should be able to handle just about everything I need for the pop-up/lightbox gallery.
But the description on their website for the Image Galleries has me concerned about the size of the files the client may be uploading. Specifically:
Images will PopUp to fill the view port of the browser, up to their actual size. We recommend you size them to the actual size you want them to be displayed
Which would mean the client will have to re-size them to the desired size before uploading them. Something I'd rather not have to have them do (NOT entirely a deal-breaker, just a Nice-to-Have if the system could handle it for them).
I'll keep looking!
Great question! The short answer is that yes, you want the images coded right into the page, but you want the CMS to output these, not you the developer -- this way the user chooses the images and the CMS automatically outputs <img> tags for them, so if the user changes the images, then the outputted <img> tags change as well.
There are generally 2 ways to do this. One is easy to develop but not the optimal user interface. The other is difficult to develop (you must be a php programmer) but offers much more flexibility to your end-users.
1) Easy(ish) for you: hard-code the image gallery into a theme template, let the user add images to a file set in the file manager to populate the slideshow.
2) Build a block that the user can add to any page they want and can manage the files directly from the block's editing dialog (just like the built-in "slideshow" block that comes with Concrete5).
3) There's also a hybrid method where you have a block for the slideshow but the user chooses a file set to populate the images, so it's more flexible and easier to add to pages, but there's an extra step involved for the user to manage the images.
If you want to build your own slideshow and you're not a php coder, option #1 is the way to go. If you're a beginning php coder or know a little bit but are willing to experiment and learn, option #3 is the way to go. If you're an expert PHP coder and willing to spend time learning the ins and outs of how Concrete5 blocks work, then option #2 is the way to go.
Let me know where you're at on this scale and I can provide some sample code to get you started along one of these approaches.
BTW, I've also answered a similar question before in these threads:
http://www.concrete5.org/community/forums/customizing_c5/jquery-sli...
http://www.concrete5.org/community/forums/customizing_c5/custom-int...
Hope that helps, and welcome to Concrete5!
-Jordan
There are generally 2 ways to do this. One is easy to develop but not the optimal user interface. The other is difficult to develop (you must be a php programmer) but offers much more flexibility to your end-users.
1) Easy(ish) for you: hard-code the image gallery into a theme template, let the user add images to a file set in the file manager to populate the slideshow.
2) Build a block that the user can add to any page they want and can manage the files directly from the block's editing dialog (just like the built-in "slideshow" block that comes with Concrete5).
3) There's also a hybrid method where you have a block for the slideshow but the user chooses a file set to populate the images, so it's more flexible and easier to add to pages, but there's an extra step involved for the user to manage the images.
If you want to build your own slideshow and you're not a php coder, option #1 is the way to go. If you're a beginning php coder or know a little bit but are willing to experiment and learn, option #3 is the way to go. If you're an expert PHP coder and willing to spend time learning the ins and outs of how Concrete5 blocks work, then option #2 is the way to go.
Let me know where you're at on this scale and I can provide some sample code to get you started along one of these approaches.
BTW, I've also answered a similar question before in these threads:
http://www.concrete5.org/community/forums/customizing_c5/jquery-sli...
http://www.concrete5.org/community/forums/customizing_c5/custom-int...
Hope that helps, and welcome to Concrete5!
-Jordan
Oh, forgot to mention about resizing images: yes, concrete5 includes built-in facilities to resize images (and also to crop them if you're using the latest version 5.4.2). The only problem is that there's no way to resize them BEFORE the user uploads them, so if they upload a 3MB image off their camera, it will still take a while for the upload to go through and you might also have to worry about ballooning storage space, depending on your hosting plan. But once it's outputted to the browser, yes the system can automatically scale them down to more appropriate sizes.
Thanks for the info re: C5's editing capabilities. I get it that it happens AFTER the humongous original file is uploaded to the server. ;) But, since storage space is (relatively) cheap, this shouldn't end up being too big of a problem. And since the client will be uploading them from a high-speed, broadband connection, I'm not too worried about how long it will take for the upload to complete.
If it ends up that the large original files are a problem, I'm also looking at a Windows PowerToy (for XP... there's a clone of it for other WinOS's) for easily resizing images locally, before uploading them, that appears to do a good job - it looks easy-to-use and has a good algorithm so the end-result is a good compromise on file size and image quality.
Thanks again!
If it ends up that the large original files are a problem, I'm also looking at a Windows PowerToy (for XP... there's a clone of it for other WinOS's) for easily resizing images locally, before uploading them, that appears to do a good job - it looks easy-to-use and has a good algorithm so the end-result is a good compromise on file size and image quality.
Thanks again!
Jordan,
Thanks LOADS for the great reply! I'm no PHP programmer, but I'm pretty good at sleuthing things out by getting under the hood and I'm not afraid to experiment.
Option #3 actually sounds pretty good... especially since using the C5 File Manager DOES help keep the end-user used to the idea of going there to add/manage images. Plus the added bonus of allowing them to then edit the image using the Picnic tools. Not shabby!
I'm not sure yet how the site is going to end up being structured, but I do know that they will want to have several different slideshows/lightboxes... one for each of several properties. And the list of properties is going to grow/change over time. So I anticipate that they are going to want to be able to add pages/areas/blocks (whichever ends up being needed based on the design) for new properties/slideshows.
Knowing that (1) Concrete5 has the ability (either through Add-Ons or some custom coding) to handle this requirement and (2) that the Concrete5 user community is this responsive (seriously... kudos for the awesome response!) helps me to feel much more confident choosing Concrete5 as the CMS to handle this project!
Thanks loads! I'm sure you'll be seeing more of me on here soon. LOL!
Thanks LOADS for the great reply! I'm no PHP programmer, but I'm pretty good at sleuthing things out by getting under the hood and I'm not afraid to experiment.
Option #3 actually sounds pretty good... especially since using the C5 File Manager DOES help keep the end-user used to the idea of going there to add/manage images. Plus the added bonus of allowing them to then edit the image using the Picnic tools. Not shabby!
I'm not sure yet how the site is going to end up being structured, but I do know that they will want to have several different slideshows/lightboxes... one for each of several properties. And the list of properties is going to grow/change over time. So I anticipate that they are going to want to be able to add pages/areas/blocks (whichever ends up being needed based on the design) for new properties/slideshows.
Knowing that (1) Concrete5 has the ability (either through Add-Ons or some custom coding) to handle this requirement and (2) that the Concrete5 user community is this responsive (seriously... kudos for the awesome response!) helps me to feel much more confident choosing Concrete5 as the CMS to handle this project!
Thanks loads! I'm sure you'll be seeing more of me on here soon. LOL!
This thread finally motivated me to put the finishing touches on some boilerplate code I've been using for a while. It's an image gallery block with a very simple back-end (user just chooses a file set), but it contains a half dozen different front-ends you can choose from (Galleria, Galleriffic, Fancybox, a few others). It is intended to be used as a starting point and code sample for how a designer/developer could implement pretty much any jquery / javascript slideshow/slider/gallery/whatever you want in C5. It's fairly well documented as well.
https://github.com/jordanlev/c5_designer_gallery...
https://github.com/jordanlev/c5_designer_gallery...
Sweet! Thanks for posting this, Jordan! Can't wait to dig in and start getting my head around all of this fun Concrete5 stuff! I really appreciate the fact that you're sharing this kind of code & knowledge... it's invaluable to someone like me who's just dipping their toes in!
Rock on, dude!
Rock on, dude!
Your client shouldn't have any problem uploading new images to the file manager other than too large a file upload can bottleneck. Many of the galleries re-size automatically and Concrete uses a very easy to use image editor built into the file manager (Picnic).
Give it a try... its more versatile then you may realize