By jaarong on

I have no idea how many images that my authors may want to upload for a certain content type. I can definitely limit it at 5 if that would help, but I would like to display these images with the content in a separate block on the page. I'd like to know the best way to do this in terms of solid modules that aren't going away anytime soon. Programming is not a problem as long as the documentation is there.

⋅ Categories: Drupal 6.x

Comments

semperos’s picture

semperos commented

You can accomplish this with ImageField, ImageCache, and the Views module. These are definitely "solid modules that aren't going away anytime soon", except Drupal 7 will have some of this functionality already built in :)

  1. ImageField depends on the FileField module. It gives you a special CCK field which allows you to upload images as part of a content type. You can limit the number or make it unlimited when you create the field.
  2. ImageCache allows you to automatically resize your images. You probably don't want the full size images for the block, so you could create a smaller preset size for images going into the block.
  3. Views lets you create dynamic queries and "plop" the data in different ways, including inside a block. You can create a new View with the following settings to accomplish what you want:
    1. Create a new View. Give it a name and keep it as a "Node" type View (this is the default).
    2. For fields, add your custom image field for the content type you're pulling from. In terms of this field's settings in the View, I'd suggest removing the label (folks don't need to see "Image:" next to an image to know it's an image :), AND, for the Format drop-down, you should select your imagecache preset size that you made for images that are going to show up in this View's block.
    3. Here's the magic: Add an argument. Under Action to take if argument is not present, select the radio button that reads Provide default argument. Then, under Default argument type, select Node ID from URL. (Basically, this tells the View what node it's looking at, so it knows which node to pull the images from. It's like an advanced filter).
    4. Add any other sorting or filters that you want.
    5. Finally, make sure to add a "Block" display (you just get a "Default" display by default). Save your View.

      6. REMEMBER, the block is still in the "Disabled" area of your block administration page. You need to go there and place it in one of your theme's regions and set its visibility settings. Have fun :)

jaarong’s picture

jaarong commented

thanks for the reply, that's really helpful information. What should I do about multiple images? Put 5 filefields in the content type? Will views decide what to do if there are multiple images? Maybe Views Slideshow?

semperos’s picture

semperos commented

You can set a firm "you can't upload more than this" limit in the image field's settings page, and/or you can set a dynamic "don't display more than X number of images in my block" with parameters in your View.

  • For each image field you create, you can specify how many uploads are allowed for that one field. You can limit folks to a certain number or make it unlimited (it's a drop-down called Number of values on the field's settings page). After they upload one image, if you allow more than one, there will be a button for "Add another item".
  • You can also put a limit on what the View renders. If you let folks upload unlimited numbers of pictures (via the field's settings) but you only want your block to display 5 of them, then you can set the View's Items to display number to 5 (or whatever you want).

If you want it to be a slideshow, you can install the Views slideshow module and change your View's Style to Slideshow, but that obviously requires some more Views configuration.

jaarong’s picture

jaarong commented

ahh, thanks. The "number of values" was throwing me off. I didn't equate that with being able to add additional items, I thought it was referring to numeric field values.

jaarong’s picture

jaarong commented

I'm having some problems with this. For some reason, all images show up in the block, no matter what. I've tried setting the limit to one, but it doesn't seem to affect it. Other than that, this is working perfectly. I've been able to incorporate Views Slideshow or Lightbox2, and I may end up doing some combination of the two, but I need only one image to show in the block at a time.

Here's a screenshot of my View settings: http://i.imgur.com/0TdVN.png

vasarley’s picture

vasarley commented

Hi,

I have the same trouble. I am still getting multi images displaying together instead of only the requested 1 item to display.

Cheers

Update

I have left my 'item to display' set to 1. I have changed my field Content:Photo to checked 'Group multiple values' with 'Show value' to 1, 'starting from' 0.

This has stopped the displaying of multi photos at the same time down to only the one photo, BUT, it will not slideshow into the next photos. It repeats the first photo over and over.

I do have the argument of Node:nid with Node ID from url - as I only want the related photos.

Is there something else I need to do?

Cheers

*** UPDATED ***

Thought I would share my process and settings in case it can allow someone to help me.

I have created a content type with many fields. One of these fields is a photo upload (field_photo). This photo upload allows multi photos. All is good and the page shows all the photos one after the other on their own related pages.

What I wish to achieve is instead of the photos displayed one after the other on their node page, I would like one photo displayed to then slideshow the multi uploaded photos in relation to their relative node page.

The working example is for an animal profile entry where their details are entered via the content type, many fields of details including the animals photos that may comprise of 1-10 photos. When loading the profile page, node page. To save space by displaying the photos in the one area as a slideshow.

I have installed views slideshow and the needed modules.

I have created a view with these settings;-

Style: Slideshow
Grouping field: None.
List type: Unordered.
Slideshow mode: Single Frame.
Hover breakout: Teaser.
Display teasers last: Checked.
Mouse hover: Hover.
Timer delay: 2000.
Slideshow sort order: Forward.
Fade: Checked.
Fade speed: Slow
Fade value: 0.25

Row Style: Fields
Inline fields: Unchecked field content:photo (field_photo)
Separator: blank.

Use AJAX: No

Use page: No

Items to display: 1

The rest as normal.

Then in Arguments;-
Node: Nid.
Provide default argument
Default argument: Node ID from URL

The rest as normal.

The fields;-
Content: Photo Lightbox2 slideshow: Large->original
Group multiple values: Checked. Show 1 value starting from 0

Then a couple of filters;-
Node: Published Yes
Node: Type = Content Type.

The slideshow appears to work but will only display the same first photo over and over again. It will not show the other uploaded photos.

Sorry to be lengthy but I am now lost with info over load from my searches.

Cheers

mcfilms’s picture

mcfilms commented

Try changing Items to display: 1 to the number of images you have.

A list of some of the Drupal sites I have designed and/or developed can be viewed at motioncity.com

vasarley’s picture

vasarley commented

Hi mcfilms,

I have attempted that, alas no good.

Thanks for your offer.

mcfilms’s picture

mcfilms commented

One more idea. If your original content was ONE node and one imagefield and you had uploaded a bunch of images into it, that might not work. You may need a new imagefield for each image. I'm not much help with this, because I use Dynamic Display Blocks for this type of thing.

A list of some of the Drupal sites I have designed and/or developed can be viewed at motioncity.com

vasarley’s picture

vasarley commented

Many thanks mcfilms,

I have looked at Dynamic Display Blocks and was concerned that it might not allow me to do what I need.

Can you let me know if it will allow me to achieve one photo displayed to then slideshow the multi uploaded photos in relation to their relative node page. The node page is coded with a slideshow view that can pull the related photos for that page?

Does DDB allow the role/user to relate the uploaded photos so that when the node page is called it will only slideshow the related photos?

Cheers

mcfilms’s picture

mcfilms commented

DDB can use views to select the photos (and text) used in the blocks. So it can reference a View with an argument. I know the DDBlocks module developer Philip B. is pretty helpful and responsive. You're use case is pretty specific, so you might just have to give it a shot.

A list of some of the Drupal sites I have designed and/or developed can be viewed at motioncity.com

vasarley’s picture

vasarley commented

Hi all,

I experimented and added to my content type extra fields eg, field_photo_2, field_photo_3 etc, still no luck with views putting them together as one slideshow. Still only show up one after the other under each other. Yes I have limited the item to display to 1.

I think I am starting to understand my issue.

I think the problem I am having is with my views. I am unable to configure views to show each field_photo (is the word array correct here?) to slideshow the photos.

Is my problem that views can not understand there may be many photos uploaded under the one content type field_photo, classed as an array under this field? Eg Field_photo, photo 1, photo 2, photo3 all under field_photo.

I am still unsure if views can pull from one field array of many photos and slideshow them as one? Can this be done?

Cheers

jaarong’s picture

jaarong commented

Sorry, I've put this issue down for a while, but after doing a good bit of research and knowing some AJAX/JS, the problem is not with views. What you and I both need is for the JS to hide the other pictures behind a slideshow. You actually want Views to produce as many photos as you have in the HTML, but for them to actually not be shown all at once to the end user. The JS is not hiding them for a reason that I cannot figure out. If your JS is being loaded and the divs are tagged correctly, that should be all you need, but both of those things are in place and still it doesn't hide the other photos.

I have a feeling that it is because these photos are being uploaded with an article and aren't in a image content type. The problem is, I have to do it that way because they images have to be linked to an article.

semperos’s picture

semperos commented

If you are uploading multiple images into one field, there are further settings you should be aware of.

When you add the image field as a field to your view, it should give you options regarding how to display multiple uploaded images. You can do things like, for example, limit output to the first image uploaded. I understand this isn't what you want to do, but it's an example of the options configurable at the field level.

Click on your image field field in the View and analyze your settings closely.

drahman’s picture

drahman commented

Please excuse me if I misread your intention. I am in a similar situation. I am using Ubercart. I have created a block that displays all of my new products. Each product has multiple images associated with it. I only want one image to show in this view. I think you are trying to achieve the same thing?

Semperos' suggestion worked for me. In the Fields section I edited "Content: Image". I checked "Group multiple values" option and then put Show 1 value starting from 0.

That did exactly what I wanted. 0 is the first image and 1 would be the 2nd. etc.

Hope this is what you were looking for.