Make a Drupal image gallery without using modules
I can't stand the over-use of contrib modules when they just aren't necessary. When a visitor loads your Drupal front page, all of your modules are opened and read by the server whether they affect the front page or not. PHP searches files for hooks that need to be fired, a huge number of database requests are made that don't necessarily have a purpose, and on the list goes. Why use modules that perform tasks already available to you such as including a JS library in your theme's folder, firing a trigger/action when a user logs in, or building your own custom content type? Speaking of the latter, I've been giving customers really simple image galleries through the use of CCK/ImageCache for Drupal 6 OR Fields/Image Styles for Drupal 7 and not relying on something like the Image module that requires the customer to understand taxonomy, how to track down image nodes and how they are related to the "master" image gallery term.
Regardless of whether you're doing this in D6 or D7, the overall process is the same:
- Create a new content type called "Photo Gallery" or whatever makes the most sense for your project.
- Add the necessary fields (for D6 you'll want to have CCK and ImageField installed; most sites will already have those):
- Title
- Body (keep it or lose it -- make this image gallery your own!)
- Images - create an new field called "Images" or "Photos", type = File, Widget = Image (D6) or Type = Image (D7):
- Make sure you set Images to be an "unlimited" field:
- Head to the "Display" tab for this content type, and configure the Images field to be displayed however you'd like. I recommend setting the image to display as a ImageCache/Image Style preset that links to another ImageCache/Image Style preset, then use something like Fancybox to hijack the links to display in an overlay.
Here's what you'll get:
Use this mindset throughout Drupal. Don't get trigger happy installing dozens of modules that do this for you -- setup the structure yourself and you'll have a more custom site that you know and control, and can better meet your clients needs and give them something that's less confusing to maintain.
Comments
Hijack with Fancybox
Great blog, found this while trying to get an idea for a simple gallery.
I'm not sure however how do you get Fancybox to "hijack" the links. Would be really helpful to know.
Hijack with Fancybox
I use the word hijack loosely. Fancybox automatically grabs whatever links you tell it to, so if you installed Fancybox via the Fancybox module (http://drupal.org/project/fancybox or, as I would prefer, by just downloading the fancybox.js and adding it to your theme) you could configure it to grab your links and show the results (the full image, by default) in a Fancybox overlay.
Fancybox
Can you please do a step by step for how you added fancybox (no module) to your site and how you adjusted your content to work with it. I know how to install fancybox on a non-Drupal site but I'm having trouble doing it on my Drupal site. Thanks for the help.
Sure thing.
James,
I think that's a great idea. I'll do a second post and link these to each other wherein I add Fancybox to my theme without using the module (for most flexibility and better performance!).
how to change image location
hi,
I have created gallery using your tip.
can you tell how to put two images in single row .
as you have shown in 4th image.
You would just need to add
You would just need to add the relevant CSS to tackle that, such as having your field items display inline or float left. In my case, the field is named "field_photos", so my CSS is:
div.field-name-field-photos div.field-items div.field-item {float: left;}You can take a look at the CSS on this page: http://www.salonfdl.com/album/wedding-makeup-and-hair
Add new comment