Node Gallery: The Easiest Drupal Photo Gallery

drupal node gallery

We have several different Drupal photo gallery tutorials on this blog. The most popular is Views Photo Galleries for Drupal 7, followed closely by an older tutorial, Node Gallery for Drupal 6.

However, although Views is powerful, it is too complex for many users. For this reason, Node Gallery remains very popular.

So we’ve realized that it’s time for an updated tutorial that covers Node Gallery in Drupal 7.

Node Gallery is still the easiest way to build a photo gallery in Drupal. It requires very little set-up and almost no configuration.

Create a Gallery

media_1414523282397.png
  • Choose a Gallery Name
  • Click Save
  • Click Upload New Items
media_1414523325892.png
  • You’ll be able to upload your images one-by-one, setting a Title, Caption and choosing an image:
media_1414523384381.png

Here’s how your images will appear by default:

media_1414520617180.png
  • You can re-arrange and manage the photos from the tabs at the top of the gallery:
media_1414523458890.png
That’s it. Node Gallery is up-and-running. If you need extra options, those are also available:

Extra Options #1. Modifying the gallery layout

Node Gallery doesn’t need Views, but if you install it you will be able to edit your Node Gallery layouts:

media_1414524072653.png

Extra Options #2. Multiple image uploads

If you want to upload multiple images at once, try following our Plupload tutorial.

Extra Options #3. Images inside a lightbox

If you want to have your images pop-up in lightbox, we recommend Colorbox.

First, follow this tutorial to get Colorbox installed.

Next, the settings to integrate Colorbox and Node Gallery are a little tricky, so follow along:

  • Structure > File types > Image > manage file display
media_1414522932539.png
  • Click the Node Gallery FIle Thumbnail tab
  • Check the Colorbox box
media_1414523025547.png
  • Scroll down to the bottom of the screen, and set “Content image style” to “node_gallery_thumbnail”
media_1414523128255.png
  • Save those settings.
  • Go back to your gallery and the images will be inside a pop-up:
media_1414523238266.png

Instructor

  • Steve is the founder of OSTraining. Originally from the UK, he now lives in Sarasota in the USA. Steve's work straddles the line between teaching and web development.

0 0 votes
Blog Rating
Subscribe
Notify of
9 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
wreckage

Hello there.

This is working quite well for me, but can somebody please advise me how to have ‘next image’ arrows appearing on the Colorbox images so the next picture in the gallery appears in a Colorbox?

It’s not user-friendly to have to click outside the Colorbox to close the image then select the next.
Thanks.

Erik

This answer I found on [url=http://drupal.stackexchange.com/questions/111913/node-gallery-lightbox]http://drupal.stackexchange…[/url] worked for me:
go to Admin->Structure->FileTypes->Image [Manage File Display]

Select Node Gallery File Thumbnail , select Per page gallery in the Gallery (image grouping) dropdown. Then Save Configuration.

wreckage

Thanks, Erik. That sort-of works. I’m taken to the next image when I click the current one, but there are no arrows beside the images and only a ‘hand/finger’ cursor icon to let me know that I can click.

What I’m really after is < Previous and > Next arrows either side of the images which I have seen on other sites. Perhaps not in Drupal, though.

On we go….. more research. 😉

Tim Oté

This is a simple an good way to create images gallery.
Unfortunately, I don’t understand how to integrate pupload to the items upload.
I cant change the “gallery media” field in the “Gallery item” content type to use pupload widget because it is not an image field but a file field type.

I installed Plupload integration module too, as required at the top of the “upload new items” tab (“To enable seamless bulk image uploading please install the plupload integration module”) but if i do so, the tab is blank !

I created a new image type field in “gallery item” content type (with plupload widget) but if i load multiple file, i have multiple file in one item and not separates items.
Is anybody know how to do ?
Thanx

Jeff Alberts

Followed the directions for colorbox integration, but colorbox doesn’t seem to be doing anything at all. the libraries files are there, the colorbox options in the image file type is there, but the display of the gallery is the same old original gallery.

Elizaveta Novikova

Hello,

thank you for the very useful article!

One question: what do I need to do in order Colorbox shows all photos in a gallery? not only photos from current page?

lisa

All files relating to each module should be in each (individual) folder. It seems you’re missing the swipestripe-gallery folder all together, meaning that the class in fact does not exist (When you get this error, just check that the class exists somewhere in your install.

D7: the last of the great no-p

I so miss this in Drupal 9.   It was a rock solid, simple image filing system that did everything I needed with no drama.

In D9, I can upload the image into the core module but the oh-so-simple open a display page and then right-click to get the URL or token for a quick and dirty insertion into document simply isn’t there or, if it is, no one seems to be able to find it.

Hey D7 – check out this module: https://www.drupal.org/project/media_entity_file_redirect

See if that helps.

9
0
Would love your thoughts, please comment.x
()
x