This tutorial is an addition to my previous tutorial on creating a simple gallery in Drupal 6 using CCK and views. This tutorial will enable users to create galleries containing multiple images per node with each album being listed within a view presented by one of the node’s images.
This tutorial was written with the following versions of Drupal and module:
- Drupal 6.11
- CCK (Content Construction Kit) 6.x-2.2
- Views 6.x-2.5
- Filefield 6.x-3.0
- Imagefield 6.x-3.0
- ImageAPI 6.x-1.6
- Imagecache 6.x-2.0-beta9
- Lightbox2 6.x-1.9
Note: These were the latest versions as of writing this tutorial.
Installation
Install Drupal as normal and extract each of the modules to /sites/all/modules directory.
Navigate to /admin/build/modules and enable the following modules:
- Content
- Filefield
- Imagefield
- ImageAPI
- ImageAPI GD2 (unless your server is configured for Imagemagick, then enable the ImageMagick module instead)
- ImageCache
- ImageCache UI
- Lightbox2
- Views
- Views UI
Once you have ticked all the modules, press Save configuration.
Imagecache
You may wish to create more presets, but for this tutorial we will just create 2, a thumbnail for each image and a larger lightbox image.
Navigate to /admin/build/imagecache and click Add new preset.
Set the preset Namespace to thumbnail. Click Add Scale and Crop, set the width to 300 and the height to 200.
Then create a new imagecache preset with the name lightbox. This time select Add Scale and set the width to 800 and the height to 600.
CCK Imagefield
We will need to create a content type that we will use for our albums. To keep this simple, I am calling mine Album with the machine name album.
Navigate to /admin/content/types and click Add content type.
Under Submission form settings, set the Title field name to Album name and set the Body field label to description.
Save the content type.
Next to the Album content type click manage fields. In the Add New field area, set the label to Images and the field name to images (to make it field_images), for the Type of data to store, select File then for Form element select Image. Press Save.
You may need to set the Permitted upload file extensions. By default mine was set to txt. Change this to jpg gif jpeg png.
Under Global settings, tick the Required box and set the Number of values to Unlimited. Leave the List field disabled and set the Description field to Enabled.
Then press the Save field settings button.
Now click the Display fields tab at the top of the page.
Set the Label to Hidden and set both the Teaser and Full node to Lightbox2: thumbnail->lightbox.
Now under /node/add/album we can add some images to go in to our album.
For now create 3 or 4 albums.
Under /admin/content/node you should now have some nodes.
Views
Navigate to /admin/build/views and click the Add tab at the top of the page. Set the view name to something like albums, leave the View type set to node and click Next.
Set the title to Albums. For Style set to Grid then chose 3 columns and set Alignment to Horizontal.
For Use pager set to Full pager. Then for Items per page, set to a multiple of 3, I am going to use 9 to give us a 3×3 grid of images. If you wish, you can set Use AJAX to Yes to stop the whole page being loaded on the pager.
Add the following Filters:
- Node: Published = On
- Node: Type = Album
Under Fields select Content: Images (field_images), Node: Body and Node: Title.
Set Label to None and change Format to thumbnail image and set the Show value to 1 value. Tick the box that says Link this field to its node, this will allow the image to be clickable. Press Update.
For node body, delete the text in the Label field and press Update. If you have used long descriptions for your albums, you may wish to use the Trim this field to maximum length to limit the length of the description.
For title, delete the Label text and tick the box next to Link this field to its node, press Update.
At the moment Drupal has these fields in the wrong order, so you will need to click the up and down arrow next to the + button on fields.
And reorder the fields in to the following order: Image –> Title –> Body or if you wish you can keep them how they are.
Under Relationships, click the + button and select Content: Images (field_images) – fid.
Tick the box that says Require this relationship and set the Delta to 1. This will check to make sure that the album contains at least 1 image. Setting Delta to all will result in odd behaviour in the album due to duplicates.
If you wish you can add some sort criteria so that the newest albums appear first etc.
On the left select Page from the drop down and click Add display.
Under Path set to albums.
Press Save.
Now if you navigate to /albums you can see your gallery in action.
For your album nodes, you can modify them however you want to get the display you are looking for, whether you use Panels or create a custom node-album.tpl.php is up to you.
Update: I have now written a tutorial on creating a grid of images within an album using the node-album.tpl.php method.
143 Responses to “Create an album based image gallery in Drupal 6 using CCK and views”
Brilliant!
Thanks this is more than helpfull!
Great tutorial! I am using this system on an art website I run. Now working on another one for a client which is based on individual image nodes grouped by node reference to a gallery content type. I was worried about bulk uploading, I think a question about this came up on the other comment thread – in case anyone wasn’t aware (I wasn’t), image fupload supports bulk uploads where a node is created for every image.
Hello,
I was just using your tutorial for building a gallery using cck and views in drupal 6. When I built my gallery the way you did, I can only get it to display the images in a list. I would like the images to go 3 across (or maybe more, and then go to the next line. I think I may be missing something simple, but I am a little confused if I need panels to do this. I see in your example, your view shows the albums as 3×3 layout and not in a list. I have checked out panels but I still can’t seem to get it to display the way I would like. Any help would be greatly appreciated.
Cheers,
Wes
Sounds like you have missed setting the view style to Grid. It is on the left of the options below the view title.
sorry i did all what u said before but unfortunately the album images appear test only not thumbnail and when i click on it open a lightbox with no image sign to display pls help
Make sure the images are on the server and that the lightbox images are created in your imagecache folder. You may also need to give access to users to view the imagecache files.
how to give access to users to view the imagecache files
Under Permissions in User Management.
I seriously love you!!!!!! you have saved me a lot of time and hair pulling!! Thanks a lot. I have one question and that is can you get the single album image on the albums page to link directly to that respective album in lightbox w/o going to the interim display for that album? Any suggestions are helpful. Thanks again. Nice Aston….
I would say no, as the lightbox code looks for multiple a tags with rel=”lightbox[albumname]” so if you only had 1 image, it would only show 1, unless you had all the images with links shown and hid the rest using CSS, but that is a bit of an ugly way of doing it.
Hello. Your website is most excellent.
I have followed both your image gallery and album based gallery tutorials.
This may be a stupid question but, how to I add more images to the galleries created in this tutorial?
Everything works fine. I go to /albums and it shows me my album categories, then I click on one of the categories and it takes me to the next page with the images using lighbox. My question is, how do i add more images to the page my albums link to?
Thanks again.
Not 100% sure what you mean. Do you want to add more albums or more images within existing albums?
To create more albums you go to node/add/album. To add more images to existing albums, you can either click the Edit tab when in the album itself, or go to admin/content/node then click edit next to the album that you wish to add the images to.
This is a wonderful tutorial, but am having a lil problem, everything displays just fine but when i go in the albums, i want to edit the way they display but for some reason i cannot seem to know how or what to do about it. They display one after the other using only 1 column. Pls any assistance will be appreciated.. Thanks..
Like I said at the end of the article, there are multiple ways of achieving what you want to do.
Modify your node-album.tpl.php, use panels, use CCK layout, use a node override on in views
Ok then what about using panels? i got this tester running here http://1.willieandrenee.info/content/test-file
see the block on the right and it loads the respective gallery in the middle content section. AND ITS GLORIOUS i might add, what about getting it to do this …
http://www.mybrightestdiamond.com/photographs/ except that on the side its one album image that reps the gallery like as we have done.
of course us newbies want to keep asking for more thats the way we are….. thanks for bearing with us..
i feel like it can be done somehow,
This was extremely helpful and easy to follow. Thank you.
It is a nice tutorial, but I am having problem with the images. When I uploaded the images in the albums. I can see the thumbnails. When I open the albums I can not see any thumbnails. I checked the photos with original size are upload in the /files folder. The thumbnails are generated in the imagefiled_thumbs. The settings are the same like in the turorial. Do you have any idea what could be the problem? Thanks.
As supervisor/superuser the gallery-show functioned properly.
But when I logged out, and became a “regular visitor”, I could only see the titles of the albums: Neither thumbnails, nor images were visible.
By chance just before testing as a “regular visitor” (= anonymus user), I had viewed the Permissions in Drupal.
So, not seeing the thumbnails & images, made me realise it was a Permissions-issue.
Just give the anonymous user the Permission to vief the image_field you created according to this tutorial, and anyone can browse the galleries.
(Or at least: this worked for me)
Great tutorial. I’m familiar with Views 1, but this helped me with some of the ins and outs of Views 2 for a CCK photo gallery.
Using your method, how would you create a “latest photos” block or page to display let’s say the 10 latest photos uploaded into any of the albums? I’m looking to create a flickr-style grid of thumbnails (which I can theme easily) but because each album node has multiple images attached, the “items to display” setting in views effects the number of _albums_ to display, not the number of images in those albums.
Setting “Show (x) values” of course only displays x number of photos from those albums, which could give me the most recent photos from the “items to display” number of albums.
But that doesn’t get me the latest photos uploaded in _any_ album.
Does that make sense? Is that even possible with views or would I need a custom query?
Thanks!
@Josh, I think that it would have to be a custom query, but not 100%.
@David, Try changing the download method from public to private and make sure all the permissions are OK, as well as the imagecache thumbnails are being generated.
So when I add this album type. The promote to frontpage is enabled, but the 3*3 grid view is displayed and not like at “/albums”. How would I display it like this (at frontpage), 1 picture title and body, like /albums displays but just 1 album ofcours…
To my own question above in case anyone else wants to do some sort of “latest images” block, see http://drupal.org/node/485266
Totally possible with Views 2!
I’m freakin’ out! The first time I did this it worked fine, I did it with an alternative theme. Now I want to use the garland theme and the grid style just wont work! It now always shows the thumbnails in 1 single column. Is there some overritten css file or explaination to this fenomonon? This is really unlogic.
Great tutorial James.
Looks great, just need to figure out the best way to order the images in a grid when an album is selected, think CSS/node-album.tpl.php is probably best, panels feels a bit too heavy for doing that, or is it?
Also would like to be able to display/set a ‘front’ image for each album (ie, the image thats displayed on the album page, rather than random), and be able to organise them into catagories, maybe multiple views for different catagories and filtered with taxonomy for each album?
@chessboxing, for the images in a single column you will need to create a new file in the template folder called node-album.tpl.php and modify it to suite your needs.
@Kelly, Using panels, would require you do override the node and create a block in Views using Grid view and then set the block in the panel. If you are OK with HTML and PHP, I would go with the node-album.tpl.php method as you have more control over it, but not as easy to modify if you don’t have the skill. With Drupal6 you can move the images about once uploaded, so you simply have to move the image you want to be displayed on the gallery to the top of the list and make sure Views is pulling out the first image.
To organise in to categories you can close the View, then set the URL to taxonomy/term/%, set the title to %1 (I think, possible %2 or %3, try it and see), then set an argument in the View to pull out the taxonomy term.
admin
I don’t understand why the hell grid 3*3 for instance doesn’t work, like it is intended, right? It works for you without node-album.tpl.php in this tutorial. I redid it with a clean install. Still no 3*3.
2nd, about node-album.tpl.php, should that be blank? or what the hocus pocus should I insert? I really want to get this because it makes no sense to me…
thanks in advance
@chessboxing, the 3×3 grid is only on the gallery page which displays all the albums. Once you click on the link it goes in to the album where you get the images one after another, that is where you will need to create a node-album.tpl.php file to set up the actual album display you want. If you had set up the view like I had in the tutorial, going to http://www.domain.com/albums which show your view, whereas clicking on any of those albums would result in seeing the individual node.
That makes sense :)
However the first time, I swear to god, my album node showed up with the grid style and that is not logical. This was with the addari theme. That’s why I was so confused (freakin’ out stuff). Anyway. Thanks!
You have some references to start with node-album.tpl.php? Google can’t help me at the moment…
Great tutorial James – Thanks.
I agree with chessboxing, a reference or small tutorial to help customise an albums images would be great i.e. node-album.tpl.php
Thanks all the same!!!
James
Super tutorial! Absolutely great!
Thanks for sharing it with us.
Hello> please, post snippet of code, which should be placed in “node-album.tpl.php” to show pictures in grid 3×3…I am Php newbie, so it will save me 5 years of my mental health :-)
@zdeno, jj, chessboxing, I will do a tutorial on setting up a grid on node-album.tpl.php
hello
I have an issue uploading the image.
when i upload the image it suppose to show up, but it’s not showing while uploading. there’s a lot of issue i found on the internet. I think you don’t have that issue, i don’t know what it cause this to happen?
when i upload the picture i suppose to have a little thumbnail beside the file. but it’s not showing up
@Lewis, I assume that you have some permission errors in your folder structure that is stopping the admin preview being generated. Go to the Watchdog and see if there are any errors, also look at the status report to see if the files directory is writeable.
That would be terrific!
I have posted up some code on how to do the grid in node-album.tpl.php.
Creating a grid of images for an album in Drupal 6
[...] 06. 25. 2009 – Category: Development Following on from the tutorial of creating an album based gallery in Drupal 6. This tutorial will teach you how to create a basic grid of the images in the [...]
hi. I followed “node-album.tpl.php issue tutorial”. It is perfect…I have few questions. After click on Galeria itemin primary menu, I have problems…when I move mouse cursor over body block with list of albums (generated view), scrollbars are apearing…Have you any Idea how to resolve it? thanks a lot
@zdeno, Try it logged out, I think this is to do with the admin links that come up in views.
@rik, You may want to try out something like the Transliteration module which converts filenames of uploaded files in to good names that won’t cause problems like yours.
Drupal is great, but if you’re not a coder it can be a nightmare.
I followed the above tutorial and ran a series of test albums on my testsite (local), and everything worked fine.
Than I followed the same procedure (as far as I could tell) on my production site, and the thickbox or lightbox just would not show any picture. For reference, I could create albums, upload pictures, the thumbnails would show, lightbox works on other pages, all rights were assigned correctly, etc.
I didn’t really know which module could cause the problem, nor did I have sufficient knowledge on all the modules to even start debugging.
After a month of searching and testing, suddenly something would work: a pictured being displayed in Lightbox.
The cause turns out to be very simple, and the problem strange: I posted some weddingpictures of my parents, and used their names in the jpg files, something like “Jack & Jane – 001.jpg”. Now, it turns out I cannot use the “&”, when I use “Jack and Jane”, everything works fine…
Well, again, this may help someone. I’m still not sure which module to blame. Maybe it’s a rule I’m not familiar with?
I loved this tutorial it made everything so easy. I went ahead with your next tutorial “creating a grid of images within an album using the node-album.tpl.php method” and I loved it too.
Everything worked fine. I was wondering though why the images in the grid do not display a title or description. At the end of this tutorial they displayed but after the “creating a grid of images” tutorial it only displays the image with no title or description.
Thank you very much.
Great tutorial.
Loved it.
indeed, nice tutorial. a couple of questions though..
what is the relation good for? in my case the option “Content: Images (field_images) – fid” doesn’t show up (only without ” – fid, and there’s no such thing as a “delta”). if i leave the relations it works actually just fine.
any idea, why the proper option for relations doesn’t show up?
another question regarding the node-album.tpl.php-method-tutorial. you wrote “In your content type, go to Display fields and set the Full node to .” set to what? i couldn’t find any empty entry or something between the options.
thanks in advance and cheers
The relation was to make sure the node had at least 1 image. There were cases (at least in previous module revisions), where nodes with imagefields that were required could be saved and published without any images being uploaded. Looking for the images in this case would prevent empty albums appearing.
Set the full node to <Hidden>. It will be the bottom most option. It was stripped out of the last tutorial due to a syntax error.
Thanks, great post and easy to follow. Everything worked fine the first try. When I added the node-album.tlp.php method, I noticed the captions where removed from the lightbox display. I realized that the lightbox [][] notation for grouping and caption was missing the second [] within node-album.tpl.php.
Another way to achieve the desired layout is to simply style with CSS.
Something like:
.field-field-image .field-item{
float:left;
width:300px;
height:200px
margin:0 10px 10px 0; }
@Rgazmik, that will work although you have to be careful about putting the margin and width/height in to the same CSS rule as browsers interpret the box model differently.
Hey Rgazmik,
I too have no captions after implementing the node-album.tpl.php method.
Where exactly did you put that second []? I am just not seeing it!
I would also like to try to figure out how to insert a pager into this node-album.tpl.php method. Maybe showing 8 pics per page with a more button at the bottom… Any ideas?
@Walton. The CSS method I used to obtain the grid layout allows me to NOT use the node-album.tpl.php method. So lightbox works fine. I have not, as yet, looked further into getting the second [] to display the caption.
@Rgazmik
It seems the following CSS in my theme’s local.css accomplishes the same result:
.field-field-image .field-item{
float:left;
}
Any CSS magic that can put some space between these images? Nothing I change on this particular style does anything. I don’t really want to edit the whole site’s img style.
Nevermind. I got it. We were missing a semicolon. Now I just need to figure out how to make a custom pager.
THANK! YOU! great tutorial
Hi,
Thank you for the tutorial!
My friend and I both got stumped on this:
When making the gallery, everything works perfectly when you are logged in as an admin. However, when we try to view the page unauthenticated newly created fields dont display.
It might be worth noting that this is due to a permission setting under User management -> Roles -> anonymous user -> content_permissions module
Setting the view field* boxes to checked made everything work as expected… This step doesn’t seem to be documented anywhere…
@Rgazmik
Hello. Are you sure about the second [ ]?
Another way is to include a title=” “, which is used in this example.
But it doesn’t seem to work…
thanks for this one! i tried the whole thing with a batch-upload (Image FUpload module) and it worked as well by changing every instance of the image-field to an FUpload-field, eg. in the view settings change it to content: FUpload and get the fid of FUpload instead of the image-field.
In node.tpl.php change the call to your created FUpload-field:
$images = $node->field_massupload;
so there will be only pictures shown, that were uploaded by FUpload.
@Walten,@Rgazmik:
Did you finally manage to get the captions displayed? I would be interested in the way you did it. Thank you very much!
same here!
Hey Admin, I really need your help with the grid solution. I am stuck and i would really appreciate your help. plz send me an email
This is a great tutorial!
Yet, I have a problem. My galleries cannot have more that 48 pictures in them. How can this be changed? I haven’t found any solutions :/
@Erno, How do you know you can only have 48 pictures? Do you get a message telling you that you can’t upload any more or can you upload more but only 48 show?
No errors are shown, but if I try to upload more some pictures disappear or something other strange will happen. Actually it’s my gf who has the need for hundreds of pictures and she complains that the site doesn’t support them – as it does not.
I calculated manually that 48 pictures are shown, no more.
What could be the problem?
Great tutorial.
When creating the view is it possible to link the image not to the album node but to the lightframe popup window of the album itself? (I want the album to open as a lightframe popup).
All I’m able to do is open that particular image into the lightframe popup, but there is no navigation with the other images belonging to that album.
Thank you.
Thanks for this great tutorial. Everything is working perfectly…when I’m logged in as a user. Unfortunately the images aren’t viewable when I’m logged out. How can I go about allowing anonymous users to view the images in my album?
Is there anyway to have the short description field for each image when it is showing them as thumbnails and a longer description field associated with each image when they are opened up in the lightbox frame?
your tutorial seems great but I am a beginner in drupal and i fall after:
Set the Label to Hidden and set both the Teaser and Full node to Lightbox2: thumbnail->lightbox
.Now under /node/add/album we can add some images to go in to our album.
How can I do this last sentence?
Image doesn’t appear in the list of contents
Thanks
Phil
@Philippe, Have you done the whole of the CCK Imagefield section?
Hi, thanks for the tutorial, but I have one question:
How can I sort images inside the album? I only know how to sort all ‘albums’ overview. I would like to have last uploaded image on the top inside the album.
Thx, cernuus
@cernuus, In the view for your album, edit the image field and tick the box that says Reversed.
Thank you for fast reply, but this just changed the preview picture in albums overview. I would like to sort images inside the node of one album.
I can change order manually when editing the album by moving just uploaded pictures to the top with drag&drop, but I think there should be some setting to put uploaded pictures to the top. Any ideas?
Thx, cernuus
@cernuus, depending on how you have done your album grid you will just need to change the order. If you are using the grid code from my other post change the first line to: array_reverse($images = $node->field_images, TRUE);
Thx mate, it worked. I wrote it like this:
$images = $node->field_images;
$images = array_reverse($images, TRUE);
@cernuus, Good to hear.
I followed all the steps but no image is creating inside imagecache. Though images are there inside file folder. What to do now? Please help.
@Tina, check the write permissions of the imagecache folder. You can also try changing the file system within Admin.
I am trying this in my local server and all permissions are given but facing the same problem. Also what is the meaning of “You can also try changing the file system within Admin.”
@Tina, You can go to http://localhost/admin/settings/file-system and change the file system to private and see if that helps. It may be worth asking the question on drupal.org for whichever module is causing it, which I assume is imagecache. Are the images created in the files directory?
You are simply great… Problem is solved by following your technique.
Thank you so much for this intresting and detailed tutorial!
I just have a problem. I cannot view the galleries. I point to the view but i just see an empty page! I checked many times all the steps carefully, I tried both enabling and disabling clean urls, I changed the path, I checked permissions, but no luck!
The pages seem to work fine, but when I hover the image in lightbox a bunch of code appears as alt.
Are there any solutions? It is exactly what I wanted and I try days to make a working and compatible gallery.
Thank you so much for your attention!
@manolis, change the download method from public to private in File system.
Thank you so much for your answer!
Unfortunately, I’ve already done it. I uploaded again photos but nothing.
I’ve read all comments one to one and tried most of the solutions you provided. If you cannot realize what the problem is, it’s ok! Thank you for your time!
@manolis, are you working on a proper server or localhost? If you look at the source code are the image URLs all OK? Are the images created within your files directory?
I am working on a server. I checked the code and there are no image urls. The images are ok, as when i get into the individual node they are displayed properly both thumbs and in lightbox!
@manolis, I would recommend checking your view then, may be something ticked that shouldn’t be.
Thank you so so much! A dummy mistake in the filter: node: type was the problem!
I did also the node-album tutorial and everything works just perfect!
Thank you very very much again for your time!
hello
“he 3×3 grid is only on the gallery page which displays all the albums. Once you click on the link it goes in to the album where you get the images one after another, that is where you will need to create a node-album.tpl.php file to set up the actual album display you want.”
I’d rather leave the gallery page unmolested by the lightbox pop up and instead use lightbox to niftily navigate the individual album pages/pics – like in “Create a simple image gallery in Drupal 6 using CCK and Views.”
Or is the latter (using lightbox to niftily navigate the individual album pages/pics) the point of “Creating a grid of images for an album in Drupal 6″.
Btw, love the tutorials – a really good intro to some of the possibilities of cck and views.
What are the pricni
Hi James,
Thanks heaps for the tutorial. It is all up and working fantastically well. I am wondering how I would implement the following. I have a thumbnail that I do not want to show when light box is triggered. Also all the other images that are part of that Album I do not now want to show as thumbnails. They are only to be viewed in after the thumbnail is clicked. Using your example the user would click on the astin martin thumb that would then show six other large images of the aston martin in lightbox.
Thanks again for the tutorial
Tim
Hi James…
i was facing the problem, images were not being displayed. file system settings solution solves my problem. thx a lot for a very good tutorial.
I have done every thing here… but have just one issue that im facing… i cant get the image to display…
all i get is a blank light box …. and i dun even get the thumbnails in the album
@abhax, read through the comments, there are different problems which can cause this. Clean URLs have to be enabled and the files/imagecache folder has to be writable.
Ya i think im having troubles coz of the clean URLs
cant seem to enable them on ubuntu….
will search for it…
thanks
@admin i cant get the picture inside the albums to align in a grid just like the albums are aligned in the grid here….
Inside the album they are coming one below the other… any thing done wrong??? or any thing not done?
@abhax, See the tutorial on creating a grid in Drupal 6
Hi,
Firstable I want to thank you for the tutorials!
They worked perfectly for me.
But i have a question.
Can you tell me how to fix the alignment of the images in the album?
http://guglev.net/DATA/album_view.PNG
http://guglev.net/DATA/album_conf.PNG
I want them to be in grid style?
Many thanks in advance!
@ognyang, see the tutorial on creating a grid of images in Drupal 6.
Oops.. :) My bad i didn`t see the link after the tutorial.. I`m sorry for the stupid question :)
I put /albums as the path for the view section, however I want the albums to appear in a primary menu item I already have on my site which has the path content/media. But when I put in content/media as the path, nothing shows up there!!!Help please.
thanks in advance, and this tutorial saved me.
Ok I figured out this one. But please answer the one below, thanks!
@ArtrA, Do you have the Image gallery module installed? Using the tutorial, I don’t think you should have that option.
Thanks for the speedy reply! Yea I have Image Gallery 6.x-1.0-beta5 listed under ‘Image’ in modules. What next? Thanks in advance!
@ArtA, if you aren’t using it, uninstall it and that will remove the count option from Views. I am sure there is a way that it can be done, but I don’t know how to in Views.
OK, I want to use it though, just don’t know how. Thanks for the tutorial and everything though, you saved me!
Also, how do I get the Image gallery:count to work? I turned it on, but it keeps saying there are 0 images in this gallery even though they are all populated. Thanks.
i think this tutorial may be a solution for me…
but i want to make a newbie question…
isn’t possible to create a content type “album” and create a field “field_images”, add multiple images this field and just customize the template with node-gallery.tpl.php ?????/ without creating a view….
thanks!!!
@brunorios, yes and no, that is how you will style the individual node display whereas the view is to make a grid of all your albums which users can then click to go in to and view all the images of that album.
Great tutorial, Thanks
Hi James,
I followed these instructions, but I get a blank page… The View title is there, but nothing else. I am using the current version of all the above specified modules. I already had a content type with the imagefield, so I did not create a new one. I went through it to make sure that it was like you specified above. Any suggestions?
Thanks,
Harry
If you view the original node with the image, is it visible?
Yes, it is… I think it may be something to do with IIS, could that be? I got it working on another setup which runs on Apache. By the way, how do you get them to display one after the other by clicking a next arrow or button? At the moment, the individual images are popping up.
Thanks again! Very well done!
Harry
Lightbox should automatically register them all and give you the next buttons. If the image is working in the individual node but not the view, I would check your view again to make sure you haven’t missed something out.
Thanks a lot of the great tutorial. I finally managed to get the albums in place.
Though I am facing an issue when I click on the albums. When I click on any album2 in
http://artbydinesh.in/photo-album I go to
http://artbydinesh.in/node/150 page and only when I click on the images I get album. Is it possible to open the album2 directly after clicking any album2 image on http://artbydinesh.in/photo-album instead of going to another page?
It is possible as I have seen it done through a Drupal site, but I haven’t looked in to how to do it.
Hi. I have sort of the same problem as Harry.
When i create an imagegallery node and upload the picture, it dosn’nt appear on the node when i view it. All i see is a broken link.
The problem is that the image dos’nt automaticly get moved to the correct folder. When i upload the picture, it gets uploaded to the folder “files/gallery”.
The broken link on the node, links to “files/imagecache/resize/gallery/image.jpg”.
I then have to resize the image manually to a “crop” and a “resize” format, and then move em to “files/imagecache/resize/gallery/image.jpg” and “files/imagecache/crop/gallery/image.jpg” for it to work.
Any idea whats wrong and what i can do to solve this?
Make sure your files directory is writable and that clean URLs is enabled.
Hi. The files directory is writable. But somehow i can’t get clean URLs to work. Think the problem is on the web-server. Im using “Internet Information Services (IIS)” on my web-server. Any idea on what to do, to get it to work?
Clean URLs in Drupal require mod_rewrite for Apache. As you are using IIS, you will need to find an alternative to mod_rewrite that works. Information on that can be found on this post on Drupal.org
Hey,
It’s an awesome tutorial that I can get it done by using Shadowbox. thank you so much.
One question regarding to block. After I get the photo gallery, how can I create a block like the Queen do it here in her website please see the link
http://www.queenrania.jo/rania/bio
She is using something from http://www.roytanck.com/2009/04/09/introducing-photo-widget-floating-thumbnails-for-your-website/
For a normal block creation from a view I know how to create it. But how can we create such a wonderfule photo widget bock in our site as she does?
Many thanks
You would have to create another module which hooks in to the views module which would allow you to create a block with a new type of display which passes the image data to the flash object.
Thank you admin for response. I haven’t hooked into view yet. Any further instruction such as which APIs should I use and how can I pass these images to the flash object? Any article specific about this? many thanks and I do appreciated it a lot.
I would love to start this module and will contribute back to Drupal for sure.
I have never hooked in to the Views API so I don’t know how easy it is to do that. As for the block, you just need to display the block using the flash object and the PHP can generate an XML output using views or a custom SQL query to pull out all the images.
I just started with Drupal, and don’t know anything about MySql nor PHP.
I just use the Drupal-interface to generate the website.
So, placing code to get a 3*3 grid for the Photo Albums is not feasable for me (yet).
But I do want users (=visitors) to see the pictures in the Albums in a grid, whilst the editor (the guy that uploads them to the site) can see them in a list on a page, en delete them at will (for him that way, that list has a purpose).
But, is it possible to get the Album in a view (which contains a grid), and so have a view of a view when viewing the gallery ?
Or, another user-friendly solution: Is it possible to start the Lightbox-slideshow of an Album at the moment a user selects that Album from the gallery (tjat is without entering the Album-page) ?
There are ways to get the lightbox to show up without going in to the node, but I haven’t looked in to how.
As for getting a grid view without PHP, I have tried to do an override using Views but haven’t been successful. One way would be to create the layout as a block, then create a node override using Panels then add that block using the node nid to build the grid but that will still require PHP.
Quote:
“To add more images to existing albums, you can either click the Edit tab when in the album itself, or go to admin/content/node then click edit next to the album that you wish to add the images to.”
It’s not very userfriendly loading all the uploaded images whenever a user wants to add an image to an existing gallery. It would be a lot better if you could just add images without editing the whole node.
It is the way Drupal works. It allows you to easily remove images as well as upload images.
Works fine but 1 little problem I’m having. I can’t seem to get the album cover image to display and instead I’m just presented with clickable text links for each album. I’ve checked my settings against yours and it’s matches up 100%. Would appreciate any help, thanks!
Is the HTML source showing the correct link to the image? If you are just seeing the text, it may be the alt text.
there was no image or alt text in the source code. I’ve just redone everything and it’s working fine now but can’t figure out why it didn’t work in the first place. Thanks for a great tutorial though!
Wow, this worked great! Thank you very much, just what I was looking for! — Danny
dear,
thank you very much for this tutorial. i have a small problem in my album view there is a messege below the album says “no images in album” screen: http://img532.imageshack.us/img532/8660/helpmeq.jpg can u please help me to get rid of this…
You have probably put the text in to the footer box of the view rather than the empty one.
Hmmmmz,
I’ve tried all the things mentionned in the comments, but I still am unable to view the images in the lightboxes.
The problem lies with my files being written to the folder
/sites/default/files/
instead of /sites/default/files/imagecache/lightbox/ and est/sites/default/files/imagecache/Thumbnail/
But since I’m all new to Drupal since today … it’s giving me a hard time where to change this setting. ( O sooo many settings O_O )
Thanks in advance !
You need clean URLs enabled and the files directory must be writable.
This is really great! Thx a million!!
Thanks for the tutorial, it helped a lot. I have a multilanguage site. Is there a way to translate the album names? I enabled Multilingual support for the Album content type. I can edit the language in the album node, but the album shows up on all languages. Selecting the language, does not filter out only albums with the required language set. Any ideas to make it work?
I tried the Translate interface feature, but it allowed to change only the page name. The album names do not show up in the Translate interface search option.
I haven’t used the translation tools/modules available for Drupal so I am unaware of any potential problems. The bit you are talking about is generated from Views, so that could be your first step to finding an answer.
Thank you for the quick answer. I’ll look into Views, maybe I’ll figure it out.
Excellent tutorial! THANKS!
I’m setting up a Drupal website and I’m wanting to display a gallery of images for a node type. I thought this great tutorial of yours was the answer, but not quite.
I’ve created a content type called cameras and added a new CCK field called ‘associated images’ (field_camera_images) with File (type of data to store) and File Upload (Form element to edit the data) so that a user can upload one or more images for that particular content type.
What I’m aiming for is to use Panels to add a gallery of images (grid style, say 3 maximum with pager for more) associated with the camera content type. Is this possible do you know?
I am working on Drupal 6.16 with all the modules you have listed for this tutorial enabled with the addition of Panels 6.x-3.7
This is turning out to be quite a challenge!
You will want to use Views rather than Panels to create that grid as in the tutorial. Not sure how you want to use Panels?
Thanks James. I’m trying to set up a view and then add it into a Panel to display on a page. What I can’t fathom out is to display a grid of associated images for the node I’m looking at. For example, if looking at /node/5, I only want to see a grid of images for that node.
You may want to follow through this tutorial: http://jamestombs.co.uk/2009-06-25/creating-a-grid-of-images-for-an-album-in-drupal/1046
James,
This is a great tutorial! It’s the answer to a Drupal newbies prayers!
I am developing a site locally and everything is working as you state in your tutorial.
I don’t know whether I am expecting too much, but I want more! Here is my scenario:-
I have created an album based gallery as you have described and have successfully created a grid of images as you have described in another tutorial.
I produce a monthly newsletter to which I want to attach a monthly album of images. I have no problem, so far.
What I DON’t want, is the monthly album to appear in the main gallery. Is that possible?
I hope that my explanation conveys what I want to do. Any advice would be gratefully received!
Thanks!
All you will need to do is a field which you can set what type of album it is, either using CCK or taxonomy.
Then in your view you can add an additional filter to select only galleries where the CCK field is “maingallery” or where the album is tagged with a certain term.
All you will need to do is a field which you can set what type of album it is, either using CCK or taxonomy.
Then in your view you can add an additional filter to select only galleries where the CCK field is “maingallery” or where the album is tagged with a certain term.
James,
How wonderfully simple! Thanks for the quick response.
Bob