Within views, a field of the type 'image' with multiple images is treated as a single indivisible field. A common wish is to display only one of the images within the view.

Searching the internet I found unsatisfactory solutions (hacks) like editing the PHP code, using third party modules or using two image fields (one with a singe image used withing the view, one with multiple images within the node).

Is there a best practice for this problem?

Comments

helloadorable’s picture

I'm trying to solve the same problem in Drupal 7 and I found this thread while searching for an answer.

I read in another thread that in Drupal 6 when you're adding the image field to your view you can specify to just show one value if there are multiple values. I don't have the right Drupal 6 site already setup to test this scenario but in any event there doesn't seem to be any such option in Drupal 7.

So, here's how I ended up solving it in case this helps you.

You probably know that for Views you can create specific template files which control how the various pieces of the view data get displayed. So I decided to make my own version of the template that overrides "Field Fields: field_image" and in that file I set all of the images except for the first one to be invisible using CSS. I suppose I could have stripped them out entirely but it was easier to code-wise just set them to be invisible.

Here's the original version of the template file for "Field Fields: field_image":

<?php
// $Id: views-view-field.tpl.php,v 1.1 2008/05/16 22:22:32 merlinofchaos Exp $
 /**
  * This template is used to print a single field in a view. It is not
  * actually used in default Views, as this is registered as a theme
  * function which has better performance. For single overrides, the
  * template is perfectly okay.
  *
  * Variables available:
  * - $view: The view object
  * - $field: The field handler object that can process the input
  * - $row: The raw SQL result that can be used
  * - $output: The processed output that will normally be used.
  *
  * When fetching output from the $row, this construct should be used:
  * $data = $row->{$field->field_alias}
  *
  * The above will guarantee that you'll always get the correct data,
  * regardless of any changes in the aliasing that might happen if
  * the view is modified.
  */
?>
<?php print $output; ?>

And here's the new version which just massages the html $output to set all but the first image to be invisible.

<?php
// $Id: views-view-field.tpl.php,v 1.1 2008/05/16 22:22:32 merlinofchaos Exp $
 /**
  * This template is used to print a single field in a view. It is not
  * actually used in default Views, as this is registered as a theme
  * function which has better performance. For single overrides, the
  * template is perfectly okay.
  *
  * Variables available:
  * - $view: The view object
  * - $field: The field handler object that can process the input
  * - $row: The raw SQL result that can be used
  * - $output: The processed output that will normally be used.
  *
  * When fetching output from the $row, this construct should be used:
  * $data = $row->{$field->field_alias}
  *
  * The above will guarantee that you'll always get the correct data,
  * regardless of any changes in the aliasing that might happen if
  * the view is modified.
  */
?>
<?php
// first set all images to be invisible
$output_with_all_images_hidden = str_replace('class="field-item ','style="display:none;" class="field-item ', $output);
// then just set the first image to be visible
$output_with_only_first_image_displayed = preg_replace('/style="display:none;"/', 'style="display:inline;"', $output_with_all_images_hidden, 1);
// now set this newly massaged html as the $output
$output = $output_with_only_first_image_displayed;
?>
<?php print $output; ?>

Hope this helps!

If anyone else knows what the "real" way to do this is, I'd love to know! In the mean time, I'm happy to say that this works just fine for now.

Ganganation’s picture

Thanks! That worked for me :D.
I guess there should be a prettier solution?
Aren't more people experiencing this problem?

In drupal 6 it was what you implicated, you can just choose 1 image, in D7 there's no such thing.

Camario39’s picture

You would think a group by would work with MIN(fid), but I can't get it working.

I'm trying MIN(fid) but then it adds other image field attributes and the grouping is duplicated for each image attached.

parisj13’s picture

Under fields, when you add your image field, one of the configuration options is "Multiple Field Settings". Under that make sure you check the box for "Display all values in the same row". The last line under this will ask how many items you want to display. Type "1". You can also specify which number to start with if you like. Hope this helps.

moinakbarali’s picture

Thanks alot, i found that.

sstacks’s picture

And I overlooked it after taking a look at the "Multiple Field Settings" several times. Thank you for posting.

Anonymous’s picture

Image --> http://danomanion.com/sites/default/files/interwebs/only-one-image.png

I overlooked it in the field settings.

benchesters’s picture

Been hours trying to work this out, that bit where you had the number simply is not in my version of views - anyone any idea how I can do this? I have nodes with multiple images but just want to display the first image in my view.

calyeung’s picture

I'm using the latest version (7.x-3.7) that's 6 days old and I too cannot find the field.

calyeung’s picture

Check this: http://drupal.org/node/622944

Uncheck 'Display all values in the same row'

Create a filter: Content: Image:delta (= 0)

Update 1:
Hmmm... This excludes items with a default image even though its image delta shows as 0.

Update 2:
It turns out that default images have a delta of null even though they display as 0. So in my case, I had to create a filter criteria and/or:

Content: Image:delta (empty) OR Content: Image:delta (= 0)

JulieEllam’s picture

Some elements of the Views UI don't work unless you are using JQuery 1.5. I couldn only see the Multiple field options after taking JQuery back to that version using JQuery Update (http://drupal.org/project/jquery_update).

hmartens’s picture

Thanks :) Nice to find an answer quickly.

Appreciate it!

Living life in a grande way.

faunapolis’s picture

Hi,

This page actually shows the way to do it with Drupal 7 and Views 3 :
http://www.metachunk.com/blog/adding-related-content-view-drupal-7

Best

rlynjb’s picture

I tried your code, but it seems it doesn't work on mine. is there something am missing? i did the cache and refresh the browser but nothing happens.

dudeshane01’s picture

Hi Guys
It is working perfectly for me without hacking any code.
Please check the attached image and it should work for you too.
flickr.com/photos/dudeshane01/11131730765/

I have numbered the steps in sequence:
1. Click the fields- image
2. Check the display in 1 row option.
3. In displays, enter 1, this shows "all" by default, change it to 1.

That is it, now go to solve some other issues.
Cheers!

MariaWebIdeas’s picture

Hi dudeshane01,

Thanks, that worked like a treat.

Adios.

sathish_sam’s picture

Hi,
@parisj13 thanks it works for me you save my time man.