Drupal Views Gallery w customisation

Views Gallery now abandonware after Drupal 6; but in D7 can be revived a little w Juicebox.

Update [at long last!]: Views Gallery was very nice in Drupal 6, but then became abandonware, not ported to Drupal 7.
Bummer! I thought, and one reason it took me a long time to upgrade/migrate to D7.

Having done so, I checked, and indeed Views Gallery not working; nothing to be seen of the galleries or images.
But I figured the images are still in folder[s] where they’ve been uploaded, and Drupal has info on them – so maybe could be able to do something to partly revive the galleries I’d created; after all, had uploaded a few thousand photos and added keywords, some information etc, and didn’t want to do all this again.

Seemed that “migrate fields” was some help; but led to getting Content: Image, apparently without these images being seen by the regular Image software. Which meant that could readily output image titles/names – rather than images being visible – and then had to click on these for browser to display images in isolation. Not much use!

Juicebox Reviving Views Gallery – well, almost…

Looking at info on galleries for Dupal 7, I found these seem a bit sparse (as Drupal 6), but Juicebox interesting.
I installed Juicebox; and with not much hope, tried this.

Found it worked, after a bit of tweaking. For Views set up as main gallery, worked really well. Free version only allows 50 images per album; but I have also set up filters to choose from keywords, so overall there’s potential for people to browse many more than 50 images.

Individual images seemed harder. But here, I found that if edited the Gallery Image content type, could select display, then find the Image – and change the “formatter” Drupal uses, from something like the regular file [ie just showing image file name], to becoming like a one-image Juicebox gallery. Could choose image sizes, and size of the “gallery”. Also worked for Teasers.

Well, not ideal, and I likely won’t use for adding fresh images to the sites; but at least all that image uploading and information entering has not gone down the drain!

now, back to the article I wrote some time ago…

Views Gallery – for Drupal 6, then Abandonware

I had long thought Drupal’s Views module could help power a photo gallery, but was daunted by the prospect of actually creating one. Happily, though, KarenS has created the Views Gallery module – which makes it relatively easy to start a gallery. [but, upgrading to Drupal 7?? – not yet sure]

Note that Views Gallery requires other modules, too: maybe you should install these first, and Views Gallery once all is ok. (I write this after Custom Pagers not working for me; not sure why.)

Once you have Views Gallery up and running, it’s relatively simple to create image galleries. But – unless I was missing something – these seem fairly basic, but open to customisation, and helping visitors with navigation.

Image sizes

Check the default image sizes – see if they’re ok for you.

I thought the default for full images – around 600×400 I think – was small, especially given many people have larger monitors than were commonplace a few years ago. To change this, head to administration – content types – image. (I chose up to 800 pixels width or length.)

As photos are uploaded, imagecache also creates smaller versions. To check if these are ok, administor – site configuration – imagecache. Not just sizes here; see if you want images cropped to size, scaled, or maybe scaled along one axis, then cropped on the other. If you’re not sure, maybe wise to experiment.

Taxonomy: such as keywords

In Taxonomy, you can choose to have existing vocabularies apply to images. Also, you could add a new vocabulary – I’ve added Photo Keywords, with free tagging, so can add keywords and phrases to each photo. These in turn become terms that Views can make use of.

Imagecache Actions

This module allows you to do various things with photos uploaded with Imagecache. Includes watermarking, and adding text. I’ve found adding text is simple (to reg images – the full size ones for my gallery); appears on existing images, and for me currently suffices as watermark.

Sections module helps give Galleries and Image pages different look

While I prefer black on white for pages where text is key – as easier to read, I find photos look best against dark, even black, backgrounds.

I had a look at the css file with Views Gallery; found I could change the background for thumbnail displays to black (and change text colour, so it’s lighter and can be seen), but not entire pages.

Changing page appearances evidently requires loading different themes for them. I found the Section module is ideal for this; with it, can select a different theme for galleries and images. I find this is, in turn, easier if have consistent, unique components in their URLs, which is possible via Taxonomy and Path Auto – in my case, I currently have galleries at galleries/* and images at photos/*. I’ve created a section for photos, which includes only pages I specify, including galleries/* and photos/*

As to theme for the photos section: it’s a v basic modification of the site’s main theme (in turn a variant of Fusion). I’ve changed a little css, such as for body color and background color, so get pags w black bacground, and text that’s still visible. For such changes, the FIrebug plugin for FIrefox, or Dragonfly in Opera, are extremely useful.

Also for galleries and photos – I’ve somewhat altered which blocks are displayed, especially to allow more width for content. (One column of blocks on right, not two as on typical pages on the site.)

Fivestar Module for voting

The Fivestar module allows people to vote for photos.

Views Module for navigation and much more

The Views module can do a whole lot of nifty things with photos, plus their titles and keywords. But it’s also one of the scariest modules in Drupal.

Here’s a little of what I found, and some of ways I created a block and page with tiny thumbnails, which users can browse through using gallery names, and keywords. Hopefully could help you; and maybe best to give this a go, rather than just reading – easier in practice I think.

First, I think it’s useful to have a look at the gallery view, which is created on installing Views Gallery. You can see much of the key choices via Edit; note too that it’s a node content view – so Full gallery is attached to nodes of a certain type (gallery). Notice some of the settings – Grid for the layout; Gallery for both relationship and arguments (hahaha; wish I knew what that meant! – but perhaps to do with pulling images belonging to gallery of a specific name), the Fields – what will be displayed, Sort criteria – for order of display; and Filters – to keep out unwanted stuff.

Unless you really know what you’re doing, it’s probably wise to now just close the gallery view, without any changes. And onward, to create one or more new views!

These new views can do a wide variety of things. Perhaps have slideshow with images (something I’ve tried; ok w thumbnails but full size images greatly trimmed for some reason), create lists of keywords for photos, create blocks and pages for browsing tiny thumbnails.
It’s possible to do a variety of things within one view – simply by adding displays like pages and blocks, and making changes to settings for these.
But, best to create a view, and make displays that are simple variants of the default.

Imageflow blocks and pages

I’ve just installed imageflow, and think it’s superb. Allows users to scroll through images much as you can quickly flick through images in Mac OS X or on an iPhone.

Good for creating blocks with thumbnails, or page or two for browsing through gallery; pretty much follow instructions as below.

For a tiny image browser page/block:

Create the view. Give it a name that will be useful to you, when you see it in lists – like tinyphotosbrowserview, say. Make it node type.
For defaults, choose grid as display;
Relationships – maybe choose gallery (based on gallery view);
Content – choose image, and there’s a heap to select from, with tiny thumbnail linked to node (= linked to page with the image) the one you perhaps want;
Sort criteria – up to you, tho Global random maybe useful;
Filters: Gallery term is one possibility. You can choose to Expose the filter, so visitors can use this to choose to view tiny thumbnails from a certain gallery. Taxonomy term is another possibility: in my case, I have free tagging for Photo Keywords, so use these in the filter. Again, you can Expose the filter, maybe allow people to select more than one term.

Now would seem a good time to save the view.

It’s pretty straightforward to create a page and a block from the view. (Via “Add Display”). For each, best to head to grid, and assign specific setting to number of rows, as well as specify number of photos to display. More rows, more photos, possible in a full page.

More views

If you create an image browser view like this, you should find it pretty straightforward to create some more views: mabye for blocks with grids of images chosen from certain galleries (without exposed filters) – these can be decorative, enhancing your site, as well as linked to image nodes.

Maybe also worthwhile to create a views page that lists your keywords – serving rather like an index/map for photos.

Views Slideshow and jcarousel

These modules are worth checking out.

With jcarousel, you need to edit css file to suit photo sizes.

Gallery Page with Panels and Views

Once you have more than one gallery, it might be worth creating an entry page for the overall gallery.

Here’s a way I’ve done this – likely clumsy, but result seems ok.

First, created custom “teasers” for each gallery.
I wanted selection of images for each gallery, with only one title. The way I figured for this is long-winded: created view with set of blocks for each gallery, with just the title linked to gallery; chose table as display (only one line in table, but a bit more interesting looking than unformatted). Also created view with set of blocks for each gallery, displaying four thumbnails (linked to image nodes) in row.

Then, used Panels to make a panel page. In this, just put column of gallery titles and thumbnail blocks: title of each gallery above its block. Makes scant use of Panels’ potential, but result is a page with the custom gallery teasers.


The Quicktabls module can also augment Views Gallery. To me, useful for displaying blocks that are same or similar in size, with different content, only one of which is visible at a time. For instance, you can show selections of thumbnails from individual galleries (displayed by views), with tabs for the galleries.

Multiple uploads with FUpload

The FUpload module allows you to upload multiple images at once, then edit some of the info on them.

Though info currently indicates this has to work with the Image module, you can ignore Image and the FUpload sub-module thingy for Image. Instead, enable FUpload under CCK, as well as main FUpload module.

Then, to administer content types – Image (for gallery; maybe rename this content type Gallery Image for clarity). Select manage fields; and then configure the Image field.

Here, you can change the widget used for uploads (from Image to Image FUpload). Then, there are a few settings – seems you require Storage mode of “one image per node”; need to select an image size for displaying in list of images on editing page – thumb might be useful; and can then see which info fields you’d like to make edits in after images uploaded.
For these Editable fields, perhaps the useful ones are Title (Node) and Description (Node), as well as Keywords (Taxonomy) if you indeed have keywords. Seems best to leave the Gallery (CCK) box unchecked – you can then upload a set of photos to a gallery chosen at the time of the upload (while if you check the box, maybe not possible to do anything re selecting a gallery).

[amazon 0596515804 full]

[amazon 0470556110 full]


Leave a Reply