Thumbnails in Silverstripe 3 GridField Summaries

Often, you will use Silverstripe 3 GridFields to handle images and will want to show image thumbnails in the summary view rather than have to give every image a title that you can later refer to when you need to edit the image. I have managed to achieve this fairly simply using the below code snippet which will give you something looking like this: Silverstripe 3 GridField summary with Thumbnails The important parts of the snippet are the ‘Thumbnail’ item in the the summary_fields static and the getThumbnail function:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
 'Varchar(255)',
'SortOrder' => 'Int'
);

static $has_one = array(
'HomePage' => 'HomePage',
'HeroImage' => 'Image'
);

public static $summary_fields = array(
'Thumbnail'=>'Thumbnail',
'Title' => 'Title'
);

public function getThumbnail() {
if ($Image = $this->HeroImage()->ID) {
return $this->HeroImage()->SetWidth(80);
} else {
return '(No Image)';
}
}

public static $default_sort='SortOrder';

public function getCMSFields() {
return new FieldList(
new TextField('Title', 'Title'),
new UploadField('HeroImage', 'Image')
);
}
}

A fairly short post but if you have any questions about anything on here, post them in the comments below or you can contact me and I will get back to you with an answer.